Question

在boxslider中，自动滑动首次正常工作。但是当我们点击控件（左箭头和右箭头）时，自动滑动不起作用。这是我的代码：

<ul id="slider-assocoates">
    <li><a href="#" target="_blank"><img src="images/abcdef.png" /></a>
    </li>
     <li><a href="#" target="_blank"><img src="images/abc.png" /></a>
     </li>
</ul>
    <nav>
        <a href="#" id="go-prev-assocoates" class="left-arrow">Prev</a>
        <a href="#" id='go-next-assocoates' class="right-arrow">Next</a>
    </nav>

$(function(){
  var slider = $('#slider-assocoates').bxSlider({
    controls: false,
    auto: true,
    pause: 6000
  });

  $('#go-prev-assocoates').click(function(){
    slider.goToPreviousSlide();
    return false;
  });

  $('#go-next-assocoates').click(function(){
    slider.goToNextSlide();
    return false;
  });

Answer 1

这可以解决您的问题;我的一个项目遇到了同样的问题：

slider.startShow();

Answer 2

var clickNextBind = function(e){
            // if auto show is running, stop it
            var x = 0; 
            if (slider.settings.auto) x = 1;
            if(x == 1) el.stopAuto();
            el.goToNextSlide();
            if(x == 1) el.startAuto();
            e.preventDefault();
        }

Answer 3

试试这个

$(function(){
    var slider = $('#slider-assocoates').bxSlider({
    controls: false,
    auto: true,
    pause: 6000
});

$('#go-prev-assocoates a, #go-next-assocoates a').click(function(e){
    var i = $(this).index();
    slider.goToSlide(i);
    slider.stopAuto();
    restart=setTimeout(function(){
        slider.startAuto();
    },500);
    return false;
});

它对我有用。

Answer 4

这是解决bxSlider 4.1.1问题的最优雅的解决方案。通过编辑 jquery.bxslider.js 文件，并添加如下所示的两行。然后转向此链接jscompressor，以压缩它。（包括缩小变量）现在它的工作原理是没有额外的编码来进行解决。（Thnx to Freelancerrs for this solution）

....

var clickNextBind = function(e){
    // if auto show is running, stop it
    if (slider.settings.auto) el.stopAuto();


    el.goToNextSlide();
    e.preventDefault();

    el.startAuto();   // ---------------JUST ADD THIS LINE

}

/**
 * Click prev binding
 *
 * @param e (event) 
 *  - DOM event object
 */
var clickPrevBind = function(e){
    // if auto show is running, stop it
    if (slider.settings.auto) el.stopAuto(); 
    el.goToPrevSlide();
    e.preventDefault();

    el.startAuto();   // ---------------JUST ADD THIS LINE

}

...

单击控件后自动滑动不起作用

4 个答案: