如何在下一次控制單擊時停止 bx-slider？

Question

單擊下一個按鈕時，我需要停止 bx-slider 自動幻燈片放映，我有以下代碼。

$(document).ready(function(){
    elementSlider=$(".monitor_slider").bxSlider({
    auto: true, pager: false,
});
$(".monitor_slider_container .bx-wrapper .bx-next").click(function(e){
        if(e.originalEvent !== undefined){
            elementSlider.stopAuto();
        }
    });
});

沒有錯誤，但滑塊會自動保持變化。

任何幫助將不勝感激。

並原諒我糟糕的英語。

Answer 1

更新

現在您只需添加參數stopAutoOnClick: true它將停止單擊控件 Next/Prev

$('.bxslider').bxSlider({
  auto: true,
  autoControls: true,
  stopAutoOnClick: true
});

來源： https : //bxslider.com/examples/auto-show-start-stop-controls/

Answer 2

感謝@Rikard，我需要編寫自己的控件。 代碼現在看起來像這樣，問題就解決了。

$(document).ready(function(){
    elementSlider=$(".monitor_slider").bxSlider({
    auto: true, pager: false,
});

    $(".bx-next").toggleClass("px-next");
    $(".px-next").toggleClass("bx-next");
$(".px-next").click(function(e){
        if(e.originalEvent !== undefined){
            elementSlider.goToNextSlide();
            return false;    
        }
    });

    $(".bx-prev").toggleClass("px-prev");
    $(".px-prev").toggleClass("bx-prev");
    $(".px-prev").click(function(e){
        if(e.originalEvent !== undefined){
            elementSlider.goToPreviousSlide();
            return false;    
        }
    });
});

似乎當您使用 goToNextSlide 和 goToPreviousSlide 函數時，自動放映會停止。