切换到另一个选项卡后，jQuery循环插件停止滑动 [英] jQuery cycle plugin stop sliding after switching to another tab

问题描述

我正在使用以下设置的 jquery cycle 插件。照片在给定时间内滑动，没有问题但是，如果我点击另一个浏览器选项卡并等待10 sn再返回幻灯片的选项卡，我看到该幻灯片已停止。它没有通过下一张照片。什么会导致这个问题？

I am using jquery cycle plugin with below settings.Photos sliding in given time out well without problem but if i click another tab of browser and wait 10 sn then back to slideshow's tab and i see that slideshow is stopped . It does not pass next photo. What can cause this problem ?

    var slideShow = $('.slideshow-container').cycle({ fx: 'fade', timeout: 3000, speed: 500, fastOnEvent: 1,
        skipInitializationCallbacks: true,
        pause: 1
    });

我使用的是jQuery 1.6.2和循环版本2.9995（最新版）。

I am using jQuery 1.6.2 and cycle version 2.9995 (latest).

您可以在 jsfiddle.net 上进行测试

推荐答案

好吧，我想我明白了。它现在正在工作，至少使用代码指定的选项。我不确定（因为我没有测试过）我的实现是否可以很好地与其他可以传递给循环插件的选项一起使用。

All right, I think I got it. It's working now, at least with the options specified by your code. I'm not sure (for I have not tested it) if my implementation will play along nicely with other options that can be passed to cycle plugin.

之所以如此问题一直出现的是下一次迭代，其中转换假定发生在前一次转换完成之前设置。在某些情况下，下一个转换在前一个转换完成之前被触发，在新转换开始时，只要有其他动画正在进行就会检查 - 如果是这样，该函数将只返回并停止（不设置下一次迭代）。正在进行的动画完成后，幻灯片停止了，因为没有安排下一次转换。

The reason why this problem has been occuring was that next iteration where transition suppose to occure was setup before completion of previous transition. In some cases, next transition was fired before the previous has finished, at the beginning of that new transition there's a check whenever there's already other animation going on - if so, the function would just return and stop (without setting up next iteration). After the ongoing animation was finished, the slideshow was stopped, because there was no next transition scheduled.

我在github上分叉了循环插件并发布了我的修复： a href =https://github.com/WTK/cycle =nofollow> https://github.com/WTK/cycle

I've forked the cycle plugin on github and published my fix: https://github.com/WTK/cycle

这篇关于切换到另一个选项卡后，jQuery循环插件停止滑动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！