Flexslider (jQuery):暂停自动动画

Question

我正在使用优秀的jQuery插件Flexslider在网页上创建一个轮播。除了一件事：我希望当用户单击页面上其他地方的给定链接时，滑块自动停止动画。

这可能吗？

Answer 1

您希望在

单击页面上其他位置的特定链接时停止滑块。假设链接有一个"some-link"类，并且假设你的flexslider有一个"flexslider"的class，在这种情况下，您可以使用以下JS代码段：

$('.some-link').click(function() { $('.flexslider').flexslider("pause"); });

您需要确保代码位于$(document).ready(function() { ... })内，或者脚本位于页面上具有"some-link"类链接的 html 下方。否则，用于添加该点击事件的选择器将不匹配任何内容（因为它尚不存在）。

顺便说一句，@Guern的解决方案具有有关如何实际暂停弹性滑块的最重要信息，但您的问题是要求再走一步。尽管已经 2 岁了，但我现在正在回答这个问题，因为它出现在谷歌搜索中。

Answer 2

当然有可能。
在此示例中，当您单击幻灯片时，它将停止，只需将单击事件绑定到您喜欢的页面链接即可。

$('.flexslider .slides > li').click(function() {
    $('.flexslider').flexslider("pause");
});

Answer 3

在包含该jQuery插件函数的列表中，有：

slider.pause()                //Function: Pause slider slideshow interval

不确定，但我认为您可以使用此功能来停止效果，如下所示：

$(#elm).flexslider().pause();

您可以在其网页上的"高级"选项卡中看到包含弹性滑块插件属性的列表。