javascript - 如何减慢 html 中图像幻灯片的播放速度?

标签 javascript html slideshow

在寻找一种(简单)方法为我的网站创建幻灯片时,我在这里发现了以下问题:How to create image slideshow in html? 。我借用了(更正后的)代码,根据我的需要进行了调整,现在我有了我想要的,但是图像之间的转换太快了。这与幻灯片的速度无关,而与从一张图像到下一张图像的混合或淡入淡出有关。变化来得太突然。我希望它们能够逐渐、顺利地发生。我可以添加什么或者如何更改它以减慢速度?这是它:

<head>
<script type="text/javascript">
var image1 = new Image()
image1.src = "images/pentagg.jpg"
var image2 = new Image()
image2.src = "images/promo.jpg"
</script>
</head>
<body>
<p><img src="images/pentagg.jpg" width="500" height="300" name="slide" /></p>
<script type="text/javascript">
        var step=1;
        function slideit()
        {
            document.images.slide.src = eval("image"+step+".src");
            if(step<2)
                step++;
            else
                step=1;
            setTimeout("slideit()",2500);
        }
        slideit();
</script>
</body>

感谢您的帮助。

最佳答案

您可以通过在代码中进行以下更改来做到这一点

setTimeout(slideit(),10000);

而不是

setTimeout(slideit(),2500);

这里2500表示2.5秒,10000表示10秒,根据需要可以使用任意参数。

希望这能解决您的问题。

关于javascript - 如何减慢 html 中图像幻灯片的播放速度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27699021/

相关文章:

javascript - 如何使用浏览器大小缩放 Javascript 幻灯片

javascript - 当我传递引用字符串的错误语句时,while 循环不会停止

javascript - 检测午夜和重置数据的最佳方法

javascript - 使用回调函数时,JQuery 表单提交不起作用

html - 浏览器中的中心按钮组

javascript - 图像 slider : maintaining equal height for all images while keeping slider responsive

javascript - 循环内的 Ajax 调用需要顺序响应

html - 如何将视频缩放到尽可能大,使背景区域完全被背景视频覆盖

javascript - 如何在 JavaScript 中将字符串中每个单词的第一个字母大写并将所有空格更改为下划线

javascript - Chrome(webkit?)无法在幻灯片中正确显示图像