Looking for a good Mouse-Over?!

[alex_cross]

I'm finishing up my new site and would like to add a new mouseover. Does anyone have ideas for a unique mouseover that does not use up a lot of code?

[madcat]

Hey,

What kind of mouseover (image, text, link)? You could use a:link:hover or a:hover for a very low pressure effect.

[alex_cross]

Link. I have used overline-underline but am trying to find something that will stand out in the customer's mind.

[rewboss]

Well, that's kind of tricky; there's not much you can do that's unique and different without resorting to Flash or image-swapping while at the same time retaining functionality.

You could use border-top, border-bottom and background colour for a rather pleasing effect. Or how about using a very small tiling graphic as a background, perhaps also with borders? It would need to be small enough to load almost instantly (but it only has to load once) and not to make the text unreadable:

a:hover { backgound-image: url(link_bground.gif); }

You could experiment with an animated graphic if you really want, but I think that might be going a bit over the top.

[edited by: rewboss at 9:19 pm (utc) on Aug. 10, 2002]

[madcat]

unique mouseover

Once you get the basic technique I don't think there's too much room for innovation in this area. Your imagination - images used, placement, context or total effect will be the key factors in someone remembering your site.

You could use the old trigger another image rollover effect here [webbuilder101.com]. This only illustrates the technique - nothing fancy.

M

[madcat]

Beat me to the punch rewboss;)

[alex_cross]

Any rollovers stand out in your minds?

[tedster]

Here's a technique I've used twice to rather satisfactory effect. You can create a look that resembles a java applet, without all the JVM hassles.

Create an animated gif to use as a background image. Make it a pulse of color, moving down, up, or sideways. Use a limited spectrum, perhaps one shade going from unsaturated to very saturated and back. Because you're going to use it in the background, it can be a very small strip, at least in one dimension and then tile.

The "off" state hides the entire background image with a solid gif. The mouseover state brings in an image with some transparency - and the color pulse shows through only in those selected, transparent spots. Keeping it simple (and minimal) makes for a memorable but not overwhelming effect.

Because the user triggers the animation and it's not on screen all the time, this can be a very tasteful use of animation.