Javascript 如何在js slider中添加自动播放功能
我正在使用codepen的Gumpy滑块。这里是链接 现在我只想添加自动播放功能。那么,如何使用活动分页实现自动播放呢Javascript 如何在js slider中添加自动播放功能,javascript,jquery,slider,slideshow,Javascript,Jquery,Slider,Slideshow,我正在使用codepen的Gumpy滑块。这里是链接 现在我只想添加自动播放功能。那么,如何使用活动分页实现自动播放呢 $(document).ready(function(){ var slide = $(".slide"); var viewWidth = $(window).width(); var sliderInner = $(".slider-inner"); var childrenNo = sliderInner.children().le
$(document).ready(function(){
var slide = $(".slide");
var viewWidth = $(window).width();
var sliderInner = $(".slider-inner");
var childrenNo = sliderInner.children().length;
sliderInner.width( viewWidth * childrenNo );
$(window).resize(function(){
viewWidth = $(window).width();
});
function setWidth(){
slide.each(function(){
$(this).width(viewWidth);
$(this).css("left", viewWidth * $(this).index());
});
}
function setActive(element){
var clickedIndex = element.index();
$(".slider-nav .active").removeClass("active");
element.addClass("active");
sliderInner.css("transform", "translateX(-" + clickedIndex * viewWidth + "px) translateZ(0)");
$(".slider-inner .active").removeClass("active");
$(".slider-inner .slide").eq(clickedIndex).addClass("active");
}
setWidth();
$(".slider-nav > div").on("click", function(){
setActive($(this));
});
$(window).resize(function(){
setWidth();
});
setTimeout(function(){
$(".slider").fadeIn(500);
}, 2000); });