相册的自动播放效果SlideShow[网站美工]
本文“相册的自动播放效果SlideShow[网站美工]”是由七道奇为您精心收集,来源于网络转载,文章版权归文章作者所有,本站不对其观点以及内容做任何评价,请读者自行判断,以下是其具体内容:
写了个SlideShow的原型,操纵image的complete,判断图片能否调用完好,调用完好今后才显示,不然是LOADING的图片,还考虑的是
1.每调用一张图片之前先呈现loading的历程,
2.调用图片中不会因为网速和图片过大而未显示全,直接跳到下一张,要按次序一张一张播放.
3.第一次 播放的时刻,因为调用图片会慢一点,重新播放是调用CACHE里的,速度就快了
<html>
<head>
<title>SlideShow</title>
<script language="JavaScript1.1">
<!--
var yourImages = new Array("Flash制作翻书效果的本性相册
var yourImages = new Array("<A href='http://webdesign.chinaitlab.com/UploadFiles_8014/201003/20100320150545903.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="
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://webdesign.chinaitlab.com/UploadFiles_8014/201003/20100320150546472.gif></div>
<img id="img" src=http://webdesign.chinaitlab.com/UploadFiles_8014/201003/20100320150555917.gif >
<center>
</div>
</body>
</html>
以上是“相册的自动播放效果SlideShow[网站美工]”的内容,如果你对以上该文章内容感兴趣,你可以看看七道奇为您推荐以下文章:
本文地址: | 与您的QQ/BBS好友分享! |