写了个SlideShow的原型,利用image的complete,判断图片是否调用完全，调用完全以后才显示，否则是LOADING的图片，还考虑的是
1.每调用一张图片之前先出现loading的过程,
2.调用图片中不会因为网速和图片过大而未显示全,直接跳到下一张,要按顺序一张一张播放.
3.第一次 播放的时候，因为调用图片会慢一点，重新播放是调用CACHE里的，速度就快了
<html>
<head>
<title>SlideShow</title>
<script language="JavaScript1.1">
<!--
var yourImages = new Array("http://blog.donews.com/images/blog_donews_com/dodo/79382/o_5540320040330075952.jpg","http://www.iqoo.com/tupian/星座壁纸/iqoo_1113__aries.jpg","http://blog.donews.com/images/blog_donews_com/dodo/79382/o_5540320040330081327.jpg","http://blog.donews.com/images/blog_donews_com/dodo/79382/o_5540320040330081426.jpg")
var currCount=0
var stop=false
function getimg(n){
preImages= new Image()
preImages.src = yourImages[n]
}
function autoPlay(){
if(currCount!=yourImages.length){
document.getElementById("img").style.display="none"
getimg(currCount)
document.getElementById("loadingbar").style.display="block"
setTimeout("loadingImg()",1000)
}
else{
currCount=0;
if (confirm("播放完毕,是否重新播放?")){
return autoPlay()
}
}
}
function loadingImg(){
if (preImages.complete) {
document.getElementById("img").src="http://www.yuyd.com/upimg/allimg/061231/1202520.gif"
document.getElementById("loadingbar").style.display="none"
document.getElementById("img").style.display="block"
document.getElementById("img").src=yourImages[currCount]
currCount=currCount 1
}
setTimeout("autoPlay()",4000)
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF">
<div style="width:700px">
<center>
<a href="javascript:autoPlay()">自动播放</a><br><br>
<div id="loadingbar" style="display:none;"><img src=http://www.yuyd.com/upimg/allimg/061231/1202521.gif></div>
<img id="img" src=http://www.yuyd.com/upimg/allimg/061231/1202520.gif >
<center>
</div>
</body>
</html>
运行代码复制代码另存代码 ——您可以运行代码察看特效，您也可以复制或者另存源代码。本代码由天极网页陶吧提供。
