首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Javascript滑块自动播放

Javascript滑块自动播放
EN

Stack Overflow用户
提问于 2013-08-28 14:37:25
回答 1查看 1.6K关注 0票数 0

我是一个新手,还在学习,我不能完全解决一个问题。我有下面的代码,我想添加自动播放功能的滑块。将会非常感谢你的帮助。

代码语言:javascript
复制
$('.feature-selection').click(function () {
        if (!$(this).hasClass('active-feature')) {
            var featureID = '#' + $(this).attr('data-feature-id');
            $('.active-feature').removeClass('active-feature');
            $(this).addClass('active-feature');
            $('.active-feature-detail').addClass('fadeOutLeftBig');
            setTimeout(function () {
                $('.fadeOutLeftBig').removeClass('active-feature-detail');
            }, 500);
            setTimeout(function () {
                $('.fadeOutLeftBig').removeClass('fadeOutLeftBig');
            }, 600);
            $(featureID).addClass('fadeInRightBig');
            var that = featureID;
            setTimeout(function () {
                $(that).removeClass('fadeInRightBig');
            }, 1000);
            $(featureID).addClass('active-feature-detail');
            var newFeatureHeight = $(featureID).height() + 88;

            $('#feature-detail-holder').css('min-height', newFeatureHeight);
        }
    });
EN

回答 1

Stack Overflow用户

发布于 2013-08-28 14:40:36

代码语言:javascript
复制
var interval = null;
$('#autoplay-button').click(function(){
    interval = setInterval(function(){
        $('.feature-selection').trigger('click');
    }, 10000);
});

$('#stop-autoplay-button').click(function(){
    clearInterval(interval);
});

$('.feature-selection').click(function () {
    if (!$(this).hasClass('active-feature')) {
        var featureID = '#' + $(this).attr('data-feature-id');
        $('.active-feature').removeClass('active-feature');
        $(this).addClass('active-feature');
        $('.active-feature-detail').addClass('fadeOutLeftBig');
        setTimeout(function () {
            $('.fadeOutLeftBig').removeClass('active-feature-detail');
        }, 500);
        setTimeout(function () {
            $('.fadeOutLeftBig').removeClass('fadeOutLeftBig');
        }, 600);
        $(featureID).addClass('fadeInRightBig');
        var that = featureID;
        setTimeout(function () {
            $(that).removeClass('fadeInRightBig');
        }, 1000);
        $(featureID).addClass('active-feature-detail');
        var newFeatureHeight = $(featureID).height() + 88;

        $('#feature-detail-holder').css('min-height', newFeatureHeight);
    }
});
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/18480937

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档