Fading

Using opacity to fade an element.

Fade In

When using opacity in Internet Explorer you use element.filters.alpha.opacity = range where range is 0 to 100

For the latest versions of Mozilla, Firefox, Netscape, and Opera you use element.style.opacity = range where range is 0 to 1

<script type="text/javascript">
<!--

step=1

opac=0
timer=""

function goOpac(){
oDivEl=document.getElementById("oDiv")
opac+=step

if(oDivEl.filters&&!window.opera){
oDivEl.filters.alpha.opacity=opac
}
else{
oDivEl.style.opacity=(opac/100)-0.001
}

timer=setTimeout("goOpac()",10)

if(opac>=100){
step=-step
clearTimeout(timer)
}

if(opac<0){
step=-step
clearTimeout(timer)
}

}

// -->
</script>
<DIV id="oDiv" style="width:300px; height:100px; background-color:#000000; filter:alpha(opacity=0); opacity:0"></DIV> <a href="#null" onclick="goOpac()">Fade</a>