In this example, I've used a background on the page, and an animated image with transparency.The background image is simply a small image of stars on a black background that is tiled through the use of a background gif. (for those who don't know how to do that, simply create your background gif and put the following after the heading: <body background="GIFNAME.gif">).
Creating the animated gif (a total of 8 images):
- The original image was a line drawing of this logo. In photoshop, I chose two colors (the reddish one and the blueish one) and had one be foreground and the other background.
- I selected the lines in the line drawing and filled them with the blue, did "save as" -- image 1 (selected the remaining color as the transparent color -- various utilities will allow you to do this.)
- With the drawing still selected, used the blend tool with the setting for midpoint at 75% and dragged through the entire image area, which created a blend between blue and red with about 3/4 blue and 1/4 red. Did "save as"
- Continued the process, changing the midpoint to 50%, then 25%, then reverse the two colors and do the same four steps.
- Put all the images together in GifBuilder and had it preserve the transparency, and it seems to gradually shift through the colors.
It's that simple.
| WebTricks Main Page | |