<div class="codetitle"> <span><a style="CURSOR: pointer" data="11317" class="copybut" id="copybut11317" onclick="doCopy('code11317')"><u>複製代碼</u></a></span>如下代碼:</div> <div class="codebody" id="code11317"> <br>渡//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br> <br> <br><meta http-equiv="Content-Type" content="text/html; charset=utf-8">> <br><meta name="author" content="CAU CS101 的Nancle"> <br><title>jQuery 圖片切換切換</title> <br><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs%20/jquery/1.10.1/jquery.min.js"></script> <br> <br>ul{position:relative;} <br>ul li{display:block ;}位置:絕對;左:0;上:0} <br>img{寬度:480px;高度:320px;邊框:5px 實心#ccc} <br>; <br>頭> <br> <br><ul>; <br><li><img src="http://down.fpwap.com/UploadFiles/sjbz/2010/6/2010615222757.jpg" alt="jquery實作圖片漸層切換相容ie6/Chrome/Firefox_jquery" ></li> <br><li><img src="http://img5.cache.netease.com/m/app/201108/31/953DDLJL.jpg" alt="jquery實作圖片漸層切換相容ie6/Chrome/Firefox_jquery" ></li> <br><li><img src="http://i-imgp.fetionpic.com/fphoto/photo1/M00/41/83/rBUyIVHfdvC9LAM6AAC873sDEoo981.jpg" alt="jquery實作圖片漸層切換相容ie6/Chrome/Firefox_jquery" ></li> <br><li><img src="http://%20img.bimg.126.net/photo/L0py2I9-0qIAd_Keov5GhQ==/1710804908448128265.jpg" alt="jquery實作圖片漸層切換相容ie6/Chrome/Firefox_jquery" ></li> <br> </ul> <br> </div> <br> <br> switchSpeed = 1000; // 圖片切換時間<br>var fadeSpeed = 1500; // 漸變時間<br>setInterval(function(){ <br>$('img').last().fadeOut(fadeSpeed, function( ){ <br>$(this).show().parent() .prependTo($('ul')); <br>}); <br>腳本> <br>身體> <br> <br><br> 效果預覽:http://quchen.cau.edu.cn/jsDev/gradien.html