<style type="text/css">
#img1 {position:absolute; width:300px; height:100px; left:220px; top:525px; z-index:1; visibility:hidden;}
#img2 {position:absolute; width:300px; height:100px; left:220px; top:525px; z-index:2}
</style>

/*
width und height müssen der Grösse Ihrer Grafiken entsprechen, left und top geben die Position innerhalb der Webseite an.
*/

<script language="JavaScript">

<!-- Begin
/************************************************************************
Script made by Martial Boissonneault © 2001 http://getElementById.com/
This script may be used and changed freely as long as this msg is intact
Visit http://getElementById.com/ for more free scripts and tutorials.
*************************************************************************/
var ie5=(document.getElementById && document.all);
var ns6=(document.getElementById && !document.all);

nPlus = 5  //the % of fading for each step
speed = 50 //the speed

// You don't have to edit below this line
nOpac = 100
function FadeImg(){
    if(document.getElementById){
        document.getElementById('img1').style.visibility="visible";
        imgs = document.getElementById('img2');
 opacity = nOpac+nPlus;
 nOpac = opacity;
 setTimeout('FadeImg()',speed);
    if(opacity>100 || opacity<0){
        nPlus=-nPlus;
    }
    if(ie5){
        imgs.style.filter="alpha(opacity=0)";
 imgs.filters.alpha.opacity = opacity;
    }
    if(ns6){
        imgs.style.MozOpacity = 0;
 imgs.style.MozOpacity = opacity/100;
    }

}
}
onload=FadeImg;
//  End -->
</script>

<div id="img1">

<img src="lara04.jpg" border=0 width=196 height=300>
</div>
<div id="img2">

<img src="lara05.jpg" border=0 width=196 height=300>
</div>

getElementById.com

Kopieren Sie bitte den Code