Winter Holiday Christmas Lights
Date : 2008 01 16 Category : Tech & DevelopmentScott Schiller redesigned his site for the holidays and I somehow missed it. He tends to experiment with JavaScript in this way, and this year is a great example:
Move your mouse over the christmas lights (with headphones), and blow off some holiday stress! Smash -all- of the lights, and you will be.. rewarded. ;) This uses SoundManager 2 for the effects, and YUI for DOM, Animation and the Slider widget. The site’s time-sensitive (night/day) and you can control the “lighting” and other effects via a slider, but I’ll leave it for you to check out if interested. ;)
I was also pleased to note that the YUI worked nearly flawlessly when the site is rendered in proper XML/standards mode (XHTML sent with the “application/xhtml+xml” MIME type), which also makes JavaScript a little more “strict” - ie., you can’t reference document.body any more, and so on.
The design is intentionally experimental, and uses a lot of alpha-transparent PNGs, animation and CSS opacity (there is an “enhanced FX” checkbox in the UI which enables/disables the fancy stuff), and will put a pretty good load on any modern system. The point was to see how the different browsers would perform; Safari 3 and Firefox 3 (beta) both handle things quite well, Opera and IE 7 do a decent job as well. (Unfortunately I had to degrade IE 6, it couldn’t handle all the PNGs + opacity.)
