zelph.com

Eric Meyer just posted an updateto his s5 script in which he has added support for alpha transparency for IE6. The fix comes thanks to Erik Arvidsson’s pngbehavior.htc. Very cool… sucks to have to hack around IE yet again but what are you going to do?

His one lament about this fix:

The one sort-of drawback to using this approach is that it seems to require that the call to pngbehavior.htc sits in an embedded style sheet, or else nothing happens. This may very well have to do with the way the JavaScript monkeys around with external style sheets during startup. If any of you IE/Win JS gurus can figure out a way to get the behavior to fire without having to embed it into the presentation, that would be stellar. If not, it’ll just be documented as a “leave this in if you’re using alpha PNGs; otherwise you can take it out” thing.

Now I don’t pretend to be an “IE/Win JS guru” but decided to play around anyway. Using the simpler example at the top of Erik’s page I saw what the “bare necessities” were. Now that I go back and look at his .htc behavior closer, I see that I am doing some of what he was doing there… but just in the JS.

What I came up with is a quick little JS script that cycles through all the images on the page, if an image is a png (detected by the extension) then it applies the appropriate filter and replaces the image with a clear .gif file. This eliminates the need to have any image specific references in the CSS or JS, and the need for the HTC file altogether.

See a demo of the script in action.

I’d get all fancy and separate out the script and stuff for you to easily peruse, but I probably need to get back to work. So just view source and poke around.

Hopefully it is found useful, and will be a help to Eric’s issue. Thanks to Erik for the initial script and research. Feedback is welcomed as I’m always willing to learn.

Comments(7)

Kudos to Chevrolet for their recent XHTML/CSS overhaul. The code is extremely clean, and they get extra brownie points for going for (and achieving) XHTML Strict compliance.

After France (who is always in the know) pointed me to the overhaul, I (naturally) went poking through their code and they are doing some sweet stuff. Much of it required by the strict standard not allowing things like “onclick” attributes in the code, they use the DOM to parse through all anchor tags on a page to create popup code, status bar messages, and more.

One thing I found weird is that they do the following at the top of each page:

if (!document.getElementById || !document.createTextNode) { window.location.replace('/upgrade/'); }

This is presumably to redirect older browsers to their upgrade page. While I can understand doing this from a standpoint of locking down your audience to your selected/supported browsers, part of the advantage of an XHTML design is that older browsers can view the site in is “degraded” form and still be able to get the information they are looking for just without the bells and whistles. This snippet of code basically eleminates that “feature” of an XHTML design, and locks those users out.

That minor confusion aside, this is a great looking rewrite of the site and whoever did the job (inside employees or vendor) are to be commended for their great job. They have been able to implement many things that we have pondered at Sprint (parsing in popup code onload, etc) and it will be intersting to see how things shake out for them over time and what others have to say about their implementation.

Edit:
After posting this I went poking around my own site and saw that Chris Moritz made a comment on my Sprint IFR article. Wonder if they were pondering using IFR for the Chevy redesign?? Oh, and got Chris’ name from a Digital Web mention of the redesign.

Edit 2:
From another mention (in portuguese) we meet antother developer (search for “thew”) who mentions yet another developer, Dave, who has a site. Hopefully Dave will put up some kind of a write-up on the launch.

Comments(4)

A great site that displays the abilities and power of CSS turned 1 year old recently. I remembr being blown away the first time I visited the site, at how varied the layout were all on the same “code”. I’ve learned much from here, and go to get ideas every now and then as well.

Comments Off