现在这行得通,我只是想使它生效,因此对于所有4个元素,“ flip”效果并非完全相同。有没有办法稍微延迟一下,还是最好的结果是在上一个翻转完成后立即执行呢?

flip()是一个jquery插件,可将对象翻转180度并显示对象的“背面”。

这是我用来每30秒自动执行一次翻转的计时代码。

<script type="text/javascript">
    $(document).ready(function () {
        $("#activitiesCard, #callStatsCard, #agentsContactedCard, #agentsSalesCard").flip({
            trigger: 'manual'
        });


        $("#activitiesCard, #callStatsCard, #agentsContactedCard, #agentsSalesCard").each(function (i) {
            var el = $(this);
            setInterval(function () {
                el.flip('toggle');
            }, 30000);
        });

    });

</script>


这可行,但是每个“卡”在同一时间被翻转。

jQuery翻转:https://nnattawat.github.io/flip/

最佳答案

翻转似乎以恒定速度(默认为500毫秒)发生,因此使计算变得简单:对于i-th元素,您只需在30 sec + 500 * i处启动计时器即可。诀窍是将setInterval()包装在setTimeout()中,以便每个元素在开始其30秒间隔倒数计时之前都有自己的固定延迟。

$(selector).each(function (i) {
  var el = $(this);
  setTimeout(function() {
    setInterval(function() {
      el.flip('toggle');
    }, 30000);
  }, 500 * i);
});

10-07 21:50
查看更多