SliderJS - 自动播放幻灯片的功能

我试图将尼克乔纳斯的精美SliderJS实现到一个网站。（https://github.com/nick-jonas/SliderJS）SliderJS - 自动播放幻灯片的功能

一切工作正常，但我希望图像自动滑动。但现在我无法获得自动播放功能。

有一种名为NextImage（）的方法 - 我认为这正是需要实现的，但我不知道它是如何工作的。

这是我的代码。

$(document).ready(function() { 

// SLIDER 
$sl = $('#slider').slider({ 
    'media': [ 
     'images/1.jpg', 
     'images/2.jpg', 
     'images/3.jpg', 
     'images/4.jpg', 
     'images/5.jpg', 
    ], 
    'startIndex': 0, 
    'easing': 'easeOutExpo', 
    'draggable': false, 
    'sizeConstraint': "cover", 
    'animationSpeed': 600, 
    'preloaderPath': "images/loading.gif", 
    'minWidth': 200, 
    'minHeight': 400, 
});

}）;

感谢大家能帮助我在这里:)

来源

2013-04-16 user1064571

您可以使用seInterval（https://developer.mozilla.org/en-US/docs/DOM/window.setInterval），它：

调用一个函数或重复执行的代码片段，具有固定时间每次调用该函数之间的延迟。

并且在您想的每个时间间隔中调用nextImage()。

你的代码如下：

var $sl; 
// SLIDER 
$(document).ready(function() { 
    $sl = $('#slider').slider({ 
     'media': [ 
      'http://cms.taradonne.com/uploads/food-541.jpg', 
      'http://cms.taradonne.com/uploads/stills-26.jpg'], 
      'startIndex': 0, 
      'easing': 'easeOutExpo', 
      'draggable': false, 
      'sizeConstraint': "cover", 
      'animationSpeed': 600, 
      'minWidth': 200, 
      'minHeight': 400, 
    }); 

    window.setInterval(function() { 
     changeImages() 
    }, 2000); 

}); 

function changeImages() { 
    $sl.nextImage(); 
}

这里是工作提琴：http://jsfiddle.net/IrvinDominin/PMRwK/1/

来源

2013-04-16 16:05:04

欧文！我爱上你了:)非常感谢你！我遇到了setInterval，但不知道在哪里准确地把它！谢谢1000倍！ – user1064571

@ user1064571很高兴为您效劳！ –

SliderJS - 自动播放幻灯片的功能

回答

相关问题