兩幅圖像交替變化所呈現的效果。

安裝

步驟一  拷貝以下腳本後貼在有關網頁的<head></head>之間。

    
<script> function stopErrors() { return true; } window.onerror = stopErrors; </script> <style type="text/css"> #img1 {position:absolute; width:500px; height:257px; left:140px; top:170px; z-index:1; visibility:hidden;} #img2 {position:absolute; width:500px; height:257px; left:140px; top:170px; z-index:2} </style> <SCRIPT LANGUAGE="JavaScript"> var ie5=(document.getElementById && document.all); var ns6=(document.getElementById && !document.all); nPlus = 10 speed = 50 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 + '%'; } } } onload=FadeImg; </script>

步驟二  拷貝以下腳本貼在網頁最靠近<body>之下。

    
<div id="img1"> <img src="maha_n.jpg" border=0 width=500 height=257> </div> <div id="img2"> <img src="maha_c.jpg" border=0 width=500 height=257> </div>