3.14.2004

I spruced up my page a bit with help from these fine resources:

http://www.dithered.com
http://devedge.netscape.com/toolbox/examples/2002/xb/ua/#Source
http://gimp-savvy.com/PHOTO-ARCHIVE/UFWS/page1.html

If you have Internet Explorer and you click on the sunflower picture, it should fade to the foreground. Click it again and it should fade back. I guess that's a little geek'ed out. Originally, I was using family pictures on my background -- so I figured visitors (especially family) would like to see the background pics with more clarity. Hence all the effects. But I ended up using the sunflower cuz...well...it's more aesthetically pleasing (I like the yellow).

Anyway, I use Netscape's ua.js sniffer script to detect the client browser. And I use the dithered API to turn off the effects in any browser other than IE. And the sunflower picture is GHS public domain. All the rest is mine.

All of the tricks were done using JavaScript and IE's visual filters. I use the alpha filter with a rectangular opacity gradient. I was using the gray filter to remove the colors in the image, but I liked the yellow on the sunflower. I use a plain alpha filter to lower the opacity on the blog content. And I use JavaScript to make the sunflower keep you company as you scroll. I had to play with it a bit to get the scrolling right. Ultimately, I just used timeouts to delay the scroll a bit. And it seemed to help on the refresh during scroll -- it's been awhile, but I think the timeouts end up getting executed on a different thread, so I'm not delaying the scroll or screen refreshes to move the image. In any case, the background painted better once I started doing that.

Here's a great resource on the visual filters:
http://www.ssi-developer.net/css/visual-filters.shtml