我想在此脚本中添加自动幻灯片，任何人都可以帮帮我吗？

华美达巴特酒店（Ramadas Bhat）

嗨，朋友，我的网站上有图片滑块

通过单击预览和下一步按钮来滑动图像。

我的问题是：是否可以添加自动启动而不是onclik？

这是我的代码：
我想向此脚本添加自动幻灯片，任何人都可以帮助我吗？没有自动播放选项。它只是在鼠标单击事件上滑动。

 $(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;
        });


    });

雷切尔·加伦（Rachel Gallen）

我假设您在div内有一个ul，称为横幅分页。努力，没有看到您的HTML。如果不这样做，您应该拥有。ul应该始终环绕lis

jQuery(document).ready(function ($) {

var slideCount = $('#banner-pagination ul li a').length;
var slideWidth = $('#banner-pagination ul li a').width();
var slideHeight = $('#banner-pagination ul li a').height();
var sliderUlWidth = slideCount * slideWidth;

$('#banner-pagination').css({ width: slideWidth, height: slideHeight });

$('#banner-pagination ul').css({ width: sliderUlWidth, marginLeft: - slideWidth });

$('#banner-pagination ul li:last-child').prependTo('#slider ul');

function moveLeft() {
    $('#banner-pagination ul').animate({
        left: + slideWidth
    }, 1000, function () {
        $('#banner-pagination ul li:last-child').prependTo('#slider ul');
        $('#banner-pagination ul').css('left', '');
    });
};


function do_slide(){
    interval = setInterval(function(){
      moveLeft();
    }, 1000);
  }
  do_slide();


 $('ul li').hover(function(){
   clearInterval(interval);
 });
  $('ul li').mouseleave(function(){
   do_slide();
 });
 });

参考

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。