在w3school(尝试一下)我有这个代码:
<!DOCTYPE html>
<html>
<body>
<img name="slide" class="slider" src="" width="400"/>
<script>
var i = 0;
var path = new Array();
path[0] = "http://vignette2.wikia.nocookie.net/batman/images/9/92/Batman-ArkhamKnight-BatsuitRender.png/revision/latest?cb=20140605151444";
path[1] = "http://vignette4.wikia.nocookie.net/injusticegodsamongus/images/c/c5/BATGIRL.png/revision/latest?cb=20130527034044";
path[2] = "http://vignette2.wikia.nocookie.net/injusticegodsamongus/images/b/bb/Raven_Render.png/revision/latest?cb=20130318184222";
path[3] = "http://vignette1.wikia.nocookie.net/injusticegodsamongus/images/7/7f/ARES.png/revision/latest?cb=20130411230035";
function swapImage() {
document.slide.src = path[i];
if (i < path.length - 1)
i++;
else
i = 0;
setTimeout("swapImage()", 2000);
}
window.onload = swapImage;
</script>
</body>
</html>
所以我尝试使用 setTimeout
函数并且它有效,但是是否可以慢速更改这些图像()?
最佳答案
如果你想改变图片显示的持续时间,你应该将setTimeout的第二个参数从2000更改为想要的时间(以毫秒为单位)。
要在图像交换上使用不同的效果,您应该将 document.slide.src = path[i];
行更改为其他内容,具体取决于您尝试调用的效果类型。尝试使用 jQuery,它有很多开箱即用的漂亮效果,但您也可以使用 css 来做到这一点。互联网上有很多很好解释的方法,因此请研究一下并找到适合您自己的方法。
关于javascript - 如何使用慢速函数 setTimeout(),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28873058/