Question

我已经使用以下

设置了bxslider

    //<![CDATA[
  jQuery.noConflict();
  jQuery(document).ready(function(){
    var slider;
    slider = jQuery('#slider-popular').bxSlider({
            infiniteLoop: true,
            hideControlOnEnd: true,
            pager: false,
            randomStart: true,
            displaySlideQty: 4,
            moveSlideQty: 1,
            auto:true,
            autoDelay:500,
            autoHover: true,
            speed: 4000
    });

    jQuery('.bx-prev').on('click',function(){
        slider.goToPreviousSlide();
        slider.speed = 500;
        slider.startShow();
        return false;
    });

    jQuery('.bx-next').on('click',function(){
        slider.goToNextSlide();
        slider.speed = 500;
        slider.startShow();
        return false;
    });
  });
//]]>

我希望在点击prev / next按钮时将滑块的速度提高到500而不是4000

以上代码不起作用（速度不会增加!!!）

在普通方式自动模式下，它应该以4000的速度滚动，但是点击前/下一个按钮它应该滚动速度为500

Answer 1

我不确定这是不是你正在寻找的东西，但这就是我开始工作的方式。

        slideSpeedAdjusted = false;
        //Set variable so you know if slider speed has been adjusted already

       //Initial bxslider
        var slider = $('#slider-popular').bxSlider({
          infiniteLoop: true,
          hideControlOnEnd: true,
          pager: false,
          randomStart: true,
          displaySlideQty: 4,
          moveSlideQty: 1,
          auto:true,
          autoDelay:500,
          autoHover: true,
          speed: 500
        });

        //Sets bxslider speed to scroll to the next slide and adjust the speed
        //so that it doesn't take forever to get to the next slide

        //Also checks to see if slide speed has already been adjusted
        if(!slideSpeedAdjusted){
        $('.bx-next').click(function(e){
            //We want to make sure the slider is at the location on reload
            //that the user was at so we use this variable to reload the slider
            //at the correct position
            var current = slider.getCurrentSlide();
            e.preventDefault();
           //just reload the slider with the function given by bxslider
           //here you can recreate the slider with the variables you desire
            slider.reloadSlider({
                startSlide: current,
                infiniteLoop: true,
                hideControlOnEnd: true,
                pager: false,
                randomStart: true,
                displaySlideQty: 4,
                moveSlideQty: 1,
                auto:true,
                autoDelay:500,
                autoHover: true,
                speed: 500
            });
            //Set slideSpeedAdjusted to true so the slider doesn't
            //reload after it's been adjusted.
            slideSpeedAdjusted = true;
            });

        //same version for the previous button
        $('.bx-prev').click(function(e){
            var current = slider.getCurrentSlide();
            e.preventDefault();
            slider.reloadSlider({
                startSlide: current,
                infiniteLoop: true,
                hideControlOnEnd: true,
                pager: false,
                randomStart: true,
                displaySlideQty: 4,
                moveSlideQty: 1,
                auto:true,
                autoDelay:500,
                autoHover: true,
                speed: 500
            });
            slideSpeedAdjusted = true;
            });
        };

单击prev / next按钮动态更改bxslider速度

1 个答案: