Question

我有五张图片，想要以2秒的间隔逐个显示在同一个div中。任何人都可以为此建议任何解决方案吗？

Answer 1

简单的javascript示例：

var currentImage = 0;
var images = [
    'a.jpg',
    'b.jpg'
];
var imageElement = document.getElementById('yourImageTagId');

function nextImage(){
    currentImage = (currentImage + 1) % images.length;
    imageElement.src = images[currentImage];
}

var timeoutId = setTimeout(nextImage, 1000);

它希望你有一些像这样的HTML：

<img src="a.jpg" id="yourImageTagId" />

Answer 2

Jquery Cycle非常灵活......你可以将它与早已标记的内容联系起来。

Answer 3

现在有很多方法可以做到这一点，但一种简单的方法是使用以下jquery插件：

http://jquery.malsup.com/cycle/

这是一个简单的演示，一个接一个地逐渐淡化图像。

http://jquery.malsup.com/cycle/basic.html

Answer 4

setTimeout

你可以这样做。

function selectData(currentIndex) {
    // select current's element "display" to "none" and show next element
    ...

    // schedule next change in two second        
    setTimeout("selectData(" + nextIndex + ");", 2000);
};

我假设所有图像都在该div中，并且具有样式display:none

动态更改div中的图像

4 个答案: