New Revised CSS Library Forums Web Tools
FAQs Awards Usage Terms Contact
Categories
Other Sections
Sweet Ads
Compatibility
Bookmark online:


FF1+ IE5+

Highlight Image Script

Author: Dynamic Drive

Note: Last updated March 27, 2002 for NS6 compatibility

Description: A script that makes any image(s) appear dull before the mouse moves over it; as the mouse moves over it, the image changes to its original appearance. This is a script controlled effect, so no altering is required to the actual image in any way.

Demo: Move your mouse over any of the images:

PE02054A.gif (1580 bytes) PE01805A.gif (1199 bytes) TN00411A.gif (2245 bytes)

Directions Developer's View

Step 1: Insert the below into the <head> section of your page:

Select All

Step 2: Finally, insert the below inside the <img> tag of all of the images you want the effect applied to:

Select All

An example would be:

<a href="whatever.htm"><img src="mygif.gif" border=0 style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>