首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >ToggleClass与bxSlider

ToggleClass与bxSlider
EN

Stack Overflow用户
提问于 2013-11-05 14:09:10
回答 1查看 205关注 0票数 0

我对Jquery有一个问题。实际上,我想创建一个简单的滑块。我在Jquery中使用bxSlider。但实际上,我想改变我的页面的背景,每次我改变图片在滑块。实际上,我使用的是这个代码:

代码语言:javascript
复制
var updateAfterSlideTransition = function() {
        if (slider.settings.infiniteLoop) {
            var position = '';
            // first slide
            if (slider.active.index == 0) {
            console.log(slider.active.index);
            $('body').toggleClass('body0', 1000).removeClass();
                // set the new position
                position = slider.children.eq(0).position();

            } else if (slider.active.index == 1) {
            console.log(slider.active.index);

                $('body').toggleClass('body1', 1000);

            } else if (slider.active.index == 2) {
            console.log(slider.active.index);

                $('body').toggleClass('body2', 1000);

            } else if (slider.active.index == getPagerQty() - 1 && slider.carousel) {
                position = slider.children.eq((getPagerQty() - 1) * getMoveBy()).position();
                // last slide
            } else if (slider.active.index == slider.children.length - 1) {
                position = slider.children.eq(slider.children.length - 1).position();
            }

            if (slider.settings.mode == 'horizontal') {
                setPositionProperty(-position.left, 'reset', 0);
                ;
            } else if (slider.settings.mode == 'vertical') {
                setPositionProperty(-position.top, 'reset', 0);
                ;
            }
        }
        // declare that the transition is complete
        slider.working = false;
        // onSlideAfter callback
        slider.settings.onSlideAfter(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);

    }

当我正常使用滑块(从左到右)时,它实际上起作用,但当我试图向后使用它时,它就不起作用了。如果你有任何想法使它变得简单或更好,请随意回答:)

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-11-05 15:02:58

嗨,我正在检查bxSlider插件,我想您可以应用这样的函数:

代码语言:javascript
复制
function classes () {
    $('body').removeClass();
    var activo = $('.bx-pager-item .active').attr('data-slide-index');
    var clas = 'body'+activo;
    $('body').addClass(clas, 300);
}

查看此演示并询问任何问题http://jsfiddle.net/Yq3RM/344/

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/19790953

复制
相关文章

相似问题

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