Question

基本上，我没有任何Javascript经验。

我必须制作一个非常简单的图像滑块，但我无法让它自动显示下一张图像。

var currentItem = $('#project-list li').first();

function showNextSlide()
{
    if(currentItem.length == 0){
        currentItem = $('#project-list li').first();
    }

    console.log(currentItem);
    currentItem.css('display', 'none');
    currentItem = currentItem.next();
    currentItem.css('display', 'block');
}

我的图片像这样加载

<ul class="project-list" id="project-list">
    <li class="project current slide-1">
        <img src="http://lorempixel.com/600/300/animals/1" />
    </li>
    <li class="project slide-2">
        <img src="http://lorempixel.com/600/300/animals/2" />
    </li>
    <li class="project slide-3">
        <img src="http://lorempixel.com/600/300/animals/3" />
    </li>
    <li class="project slide-4">
        <img src="http://lorempixel.com/600/300/animals/4" />
    </li>
</ul>

感谢任何帮助！

Answer 1

如果您想自动滑动，可以轻松使用setInterval()方法：

setInterval(function(){
    showNextSlide(); 
}, 2000);

Javascript基本滑块

1 个答案: