0

我正在尝试在 10 秒不活动后将滑块重置回第一张幻灯片。我这样做的方式确实将幻灯片踢回幻灯片 1，但是当我滑到下一张幻灯片时，它会踢回上一张下一张幻灯片而不是幻灯片 2。

我已经尝试通过更改 css 属性来处理它，这确实将其带回幻灯片 1，但没有清除下一张幻灯片以从 1 重新开始

您可以在以下笔上查看我的代码：https ://codepen.io/anon/pen/yZvOGJ

idleTimer = null;
idleState = false;
idleWait = 2000;

$(document).ready(function () {

    $('*').bind('mousemove keydown scroll', function () {

        clearTimeout(idleTimer);

        idleState = false;

        idleTimer = setTimeout(function () { 

            // Idle Event
          $("div.flickity-slider").attr({
              style: "transform: translateX(0%);"
            });
          $("div.carousel-cell:not(:first)").removeClass("is-selected").attr("aria-hidden", "true");
          $("div.carousel-cell:first").addClass("is-selected").attr("aria-hidden","false" );



            idleState = true; }, idleWait);
    });

    $("body").trigger("mousemove");

});

我试过浏览 flickity 网站上的事件部分，但我无法将 2 和 2 放在一起。任何帮助表示赞赏。

4

1 回答 1

0

经过一些咖啡和更多的试验和错误后想通了；我会发布答案而不是删除我的问题，以防其他人遇到问题。

// external js: flickity.pkgd.js
idleTimer = null;
idleState = false;
idleWait = 2000;



$(document).ready(function () {

    $('*').bind('mousemove keydown scroll', function () {

        clearTimeout(idleTimer);

        idleState = false;

        idleTimer = setTimeout(function () { 

            // Idle Event
            var $carousel = $('.carousel').flickity()
            .flickity( 'select', 0 );

            idleState = true; }, idleWait);
    });

    $("body").trigger("mousemove");

});
于 2019-02-08T20:54:41.783 回答