我正在使用出色的 jQuery 插件Flexslider在网页上创建轮播。除了一件事之外,这一切都完美无缺:我希望滑块在用户单击页面上其他位置的给定链接时自动停止动画。
这甚至可能吗?
我正在使用出色的 jQuery 插件Flexslider在网页上创建轮播。除了一件事之外,这一切都完美无缺:我希望滑块在用户单击页面上其他位置的给定链接时自动停止动画。
这甚至可能吗?
当单击页面上其他位置的特定链接时,您希望滑块停止。假设链接具有“some-link”类,并且还假设您的 flexslider 具有“flexslider”类,在这种情况下,您可以使用以下 JS 片段:
$('.some-link').click(function() {
$('.flexslider').flexslider("pause");
});
您需要确保代码位于 a$(document).ready(function() { ... })
中,或者脚本位于页面上的 html 下方,该页面具有“some-link”类的链接。否则,添加该点击事件的选择器将不匹配任何内容(因为它还不存在)。
顺便说一句,@Guern 的解决方案包含有关如何实际暂停 flexslider 的最重要信息,但您的问题是要求再迈出一步。尽管已经 2 岁了,但我现在正在回答这个问题,因为它出现在谷歌搜索中。
当然有可能。
在此示例中,当您单击幻灯片时它会停止,只需将单击事件绑定到您喜欢的页面链接。
$('.flexslider .slides > li').click(function() {
$('.flexslider').flexslider("pause");
});
在该 jQuery 插件的函数列表中,有:
slider.pause() //Function: Pause slider slideshow interval
不确定,但我认为您可以使用此功能来停止效果,如下所示:
$(#elm).flexslider().pause();
您可以在其网页上的高级选项卡中查看包含 flexslider 插件属性的列表。