-4

我想创建一个翻转内容横幅。我设法找到一个与我想要的几乎相似但仍然有我想要的东西。是否可以在没有播放按钮的情况下使其自动播放,并且在到达最后一张幻灯片时保持向左滑动的效果回到第一张。有没有人可以帮忙?我 http://jsfiddle.net/4q3GZ/342/

$(document).ready(function () {
    var height = 300,
        width = 600,
        tabs = 3,
        $tabs = $('.tab'),
        contentNum = 1,
        delay = 2000, // time in milliseconds to pause between tabs
        timer;
    $('.play').click(function () {
        var $t = $(this);
        if($t.hasClass('playing')) {
            // stop
            clearTimeout(timer);
            $t.removeClass('playing').html('play');
        } else {
            // play
            timer = setInterval(function () {
                contentNum++; // change to contentNum--; to go left
                if(contentNum > tabs) {
                    contentNum = 1;
                } // loop right
                if(contentNum < 1) {
                    contentNum = tabs;
                } // loop left
                $tabs.eq(contentNum - 1).find('a').trigger('click');
            }, delay);
            $t.addClass('playing').html('stop');
        }
    });
    $('.main_inner').css({
        width: tabs * width
    });
    $('a.tab_link').click(function () {
        $tabs.filter('.active').removeClass('active');
        $(this).parent().addClass('active');
        // make sure contentNum is a number and not a string
        contentNum = parseInt($(this).attr('rel'), 10);
        $('.main_inner').animate({
            marginLeft: '-' + (width * contentNum - width)
        }, 600);
        return false;
    });
    $('.previous a').click(function () {
        if(contentNum > 1) {
            // find previous tab, trigger a click on the link
            // subtract 2 because eq() uses zero based index
            $tabs.eq(contentNum - 2).find('a').trigger('click');
        }
        return false;
    });
    $('.next a').click(function () {
        if(contentNum < tabs) {
            // find next tab, trigger a click on the link
            // contentNum doesn't need + 1 because it is +1 relative to eq()
            // which is a zero based index
            $tabs.eq(contentNum).find('a').trigger('click');
        }
        return false;
    });
});
4

1 回答 1

0

#play按钮有一个事件侦听器,该侦听器与开始内容滑动过程的匿名函数相关联。将该匿名函数移出一个命名函数,并在页面完成加载后调用它。

但是,最好不要依赖这些预打包的解决方案,而是努力了解代码的工作原理。帮自己一个忙,学习如何在没有谷歌搜索脚本复制和粘贴的帮助下做到这一点。使用在线示例作为参考。

于 2013-03-16T05:16:47.100 回答