bx滑块:单击默认的bx传呼机后如何继续自动滑动?

问题描述

我想在单击bx传呼机项目后继续自动滑动.

I want to continue the autosliding after clicking on a bx pager item.

这是代码:

$(document).ready(function () {
    $('.bxslider').bxSlider({
        mode: 'horizontal', //mode: 'fade',
        speed: 500,
        auto: true,
        infiniteLoop: true,
        hideControlOnEnd: true,
        useCSS: false
    });

    $(".bx-pager-link").click(function () {
        console.log('bla');
        slider = $('.bxslider').bxSlider();
        slider.stopAuto();
        slider.startAuto();
        //slider.stopShow();
        //slider.startShow();
    });
});

未注释的stopShow()和startShow()函数根本不起作用. startAuto()继续幻灯片放映，但bx寻呼机导航被冻结.即使出现新的幻灯片，活动点仍保持活动状态.该怎么解决?

The uncommented stopShow() and startShow() function doesn't work at all. startAuto() continues the slideshow but the bx pager navigation is frozen. The active dot stays active even if new slide appears. How to solve that?

推荐答案

您可以这样尝试:

$(document).ready(function () {
    var slider = $('.bxslider').bxSlider({
        mode: 'horizontal', //mode: 'fade',
        speed: 500,
        auto: true,
        infiniteLoop: true,
        hideControlOnEnd: true,
        useCSS: false
    });

    $(".bx-pager-link").click(function () {
        console.log('bla');
        slider.stopAuto();
        slider.startAuto();
    });
});

或者您可以使用此:

$(document).ready(function () {
    var slider = $('.bxslider').bxSlider({
        mode: 'horizontal', //mode: 'fade',
        speed: 500,
        auto: true,
        infiniteLoop: true,
        hideControlOnEnd: true,
        useCSS: false
    });

    $('.bx-pager-item a').click(function(e){
        var i = $(this).index();
        slider.goToSlide(i);
        slider.stopAuto();
        restart=setTimeout(function(){
            slider.startAuto();
            },500);

        return false;
    });
});

第二个对我有用.

这篇关于bx滑块:单击默认的bx传呼机后如何继续自动滑动?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！