This script uses one of those cool little features that is only available MSIE browsers to alter an images opacity (degree of fading in an image). This is a great addition for webmasters that want to put more pizzaz in their image links or who want an image to "pop up" once a viewer puts his mouse over a link. Also, it is a smaller script than you would expect, so it's doesn't take up much disk space. The only down side to this script is that you must be a somewhat experienced webmaster to figure out how to utilize this script's full potential. Be sure to pay carefull attention to the color coding or you may find yourself spending many on hour figuring out how to correct a mistake you made.
The source..


<script language="JavaScript1.2">
<!--
// please keep these lines on when you copy the source
// made by: Nicolas - http://www.javascript-page.com

var first_opac = 20;
var sec_opac =100;
var opac = first_opac;
var speed = 6;
var si;
var cleared = true;

function showimage(what,doshow) {

if (document.all) {
  cleared = false;
  (doshow) ? opac+=speed : opac-=speed;
  eval(what+".filters.alpha.opacity="+opac);
  if (opac <= first_opac || opac >= sec_opac) {
    clearInterval(si);
    cleared = true;
  }
}

if (document.layers) clearInterval(si);
}

function ClearInt() {
if (!cleared) clearInterval(si);
}

//-->
</script>

<a href="http://www.javascript-page.com"><img name="image1" src="jsnow.gif" border=0 
style="filter:alpha(opacity=20)" 
onMouseover="ClearInt();si=setInterval('showimage(\'image1\',true)',10);" 
onMouseout="ClearInt();si=setInterval('showimage(\'image1\',false)',10);"></a>
Color coding..


"first_opac" is the intial opacity of the image before the viewer's mouse goes over the designated area (usually the image itself). "sec_opac" is the final opacity of the image. Both these number must be between 0 and 100. Notice the style portion of the IMG tag at bottom. You need to make sure that "first_opac" and the value for opacity in the IMG tag are the same.
The "speed" variable controls how fast the opacity of the image changes from "first_opac" to "sec_opac". The higher the number, the faster it changes. Any number between 1 and 15 should be fine.
The characters with this color are used to initiate and end the opacity sequence. You can put this string of text on a IMG tag (like shown), on a link tag (A), or any other major HTML tag. However, notice the IMG tag shown has a name. The text inside the quotes (") of the name must also be put on 2 areas: the setInterval of the onmouseover tag and the setInterval of the onmouseout tag. That tells the browser what image is to be changed. You can make two images fade at seperate times by putting the text in this color inside each image/tag, giving each image/tag a different name, putting that name in the 2 areas stated above. Confusing isn't it.
Nic's JavaScript Page