[英]How can I autoplay this javascript slider?
I have found this nice js slider that works by clicking on radio buttons, selecting the slides to view. 我发现了这个不错的js滑块,可以通过单击单选按钮,选择要查看的幻灯片来工作。
I'd like it to autoplay the slides, and give it a time for slides and transitions, but I'm honestly unsure where to put those values. 我希望它能自动播放幻灯片,并给它一点时间进行幻灯片和过渡,但是老实说,我不确定将这些值放在哪里。
I've seen the other questions about similar problems, but couldn't find a proper answer to my problem. 我看过其他有关类似问题的问题,但找不到正确的答案。 Help, please? 请帮助?
<script type="text/javascript">
$(document).ready(function () {
var showCaseItems = $('.show-case-item').hide();
var splashes = $('.splash').hide();
//get each image for each slide and set it as a background of the slide
// splashes.each(function () {
// var img = $(this).find('img');
// var imgSrc = img.attr('src');
// img.css('visibility', 'hidden');
// $(this).css({ 'background-image': 'url(' + imgSrc + ')', 'background-repeat': 'no-repeat' });
// });
splashes.eq(0).show();
showCaseItems.eq(0).show();
var prevIndex = -1;
var nextIndex = 0;
var currentIndex = 0;
$('#banner-pagination li a').click(function () {
nextIndex = parseInt($(this).attr('rel'));
if (nextIndex != currentIndex) {
$('#banner-pagination li a').html('<img src="assets/img/slidedot.png" alt="slide"/>');
$(this).html('<img src="assets/img/slidedot-active.png" alt="slide"/>');
currentIndex = nextIndex;
if (prevIndex < 0) prevIndex = 0;
splashes.eq(prevIndex).css({ opacity: 1 }).animate({ opacity: 0 }, 500, function () {
$(this).hide();
});
splashes.eq(nextIndex).show().css({ opacity: 0 }).animate({ opacity: 1 }, 500, function () { });
showCaseItems.eq(prevIndex).css({ opacity: 1 }).animate({ opacity: 0 }, 500, function () {
$(this).hide();
showCaseItems.eq(nextIndex).show().css({ opacity: 0 }).animate({ opacity: 1 }, 200, function () { });
});
prevIndex = nextIndex;
}
return false;
});
});
</script>
You can use jquery and setTimeout 您可以使用jquery和setTimeout
setTimeout(function() {$('#banner-pagination li a').trigger('click');}, 1500);
this code will loop every 1.5 seconds and trigger a click on #banner-pagination li a
该代码每1.5秒循环一次,并触发对#banner-pagination li a
you can use the jquery trigger event and hit the radio button click event forcefully 您可以使用jquery触发事件并强行按下单选按钮click事件
$('#foo').trigger('click'); $('#foo')。trigger('click');
http://api.jquery.com/trigger/ http://api.jquery.com/trigger/
setInterval(function()
{$('#banner-pagination li a[rel='+((currentIndex+1)%3)+']').trigger('click');},5000);
Thanks 谢谢
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.