Over animated?

We just assume that the Mouse Over state of a button needs to be static. But does it? No is certainly does not! This example uses a simple GIF animation for the Mouse Over state. When the mouse passes over the placid-looking Initial button, the button goes bonkers. The Out state reverts to the Initial state except the color of the symbol changes and tranquility is restored. All the symbols used in the animation are Zapf Dingbats symbols and the colors are Web safe colors so the animation is quite small.



Here's a way to get extra mileage for a button. The Initial state for this Picture Rollover simply says Page 5. As the mouse passes over, explanatory text drops down. As the mouse moves off into the mouse horizon, the number 5 becomes a cut out shape.



I bitmap-traced a colored photo of pansies, changed the fills to white and the outlines to 20% black (a Web safe gray) creating a line drawing of the flowers. The Mouse Over image is the colored photo. As the mouse moves over the image, the line drawing becomes colored and announces a spring garden sale. The Mouse Out image could have been the Initial image with different text, such as a subtle call to action, GET IN HERE AND BUY SOME PLANTS! NOW!

Simulating auto-generated buttons

You can make Picture Rollover buttons work the same way as the auto-generated buttons. Use the Initial image in place of the Mouse Out image. (The beginning and ending images are the same). For the Highlighted button, which designates the currently-selected page, use the Mouse Out image, which in this case has black text. This is how the navigation buttons at the top of the right column were created.

[eFuse Home] [Start Here] [ Plan] [Design] [ Build] [Grow] [Find ] [New]

SITE MAP - Contact us - Legal Info
www.efuse.com ©2000, NetObjects

BuiltByNOF

bulletTry NetObjects Fusion for free
bullet
Buy  NetObjects Fusion

fuseman