Javascript Flexslider在鼠标上方继续幻灯片放映
我想设置flexslider,使其在鼠标上方启动/恢复自动幻灯片放映,并在鼠标外暂停。正是正常行为的起点D 所以我有一个问题: TypeError:“undefined”不是函数(计算“slider.resume()”) 在互联网上搜索也没有任何结果 我的剧本是:Javascript Flexslider在鼠标上方继续幻灯片放映,javascript,jquery,flexslider,Javascript,Jquery,Flexslider,我想设置flexslider,使其在鼠标上方启动/恢复自动幻灯片放映,并在鼠标外暂停。正是正常行为的起点D 所以我有一个问题: TypeError:“undefined”不是函数(计算“slider.resume()”) 在互联网上搜索也没有任何结果 我的剧本是: $( document ).ready(function() { var $slider = $('.flexslider'); $slider.flexslider({ controlNav: fa
$( document ).ready(function() {
var $slider = $('.flexslider');
$slider.flexslider({
controlNav: false,
directionNav: false,
slideshow: true,
slideshowSpeed: 500,
animationSpeed: 300,
/*randomize: true,*/
controlsContainer: ".flex-container",
start: function(slider) {
slider.pause();
slider.mouseover(function() {
slider.resume();
});
},
});
}))
任何指向正确方向的指针都会有帮助
卢卡
*更新。。。我找到了一个有效的解决方案。。。如果有人想知道:
start: function(slider) {
slider.pause();
slider.manualPause = true;
$slider.mouseover(function() {
slider.manualPause = false;
slider.play();
});
$slider.mouseout(function() {
slider.manualPause = true;
slider.pause();
});
}
卢卡我找到了一个有效的解决方案:
start: function(slider) {
slider.pause();
slider.manualPause = true;
slider.mouseover(function() {
slider.manualPause = false;
slider.play();
});
slider.mouseout(function() {
slider.manualPause = true;
slider.pause();
});
}
事实上,这会更好一些:
start: function(slider) {
slider.pause();
slider.manualPause = true;
slider.mouseenter(function(){
slider.flexslider('next');
slider.play();
slider.manualPause = false;
});
slider.parent().mouseleave(function() {
slider.manualPause = true;
slider.pause();
});
}
它可以防止函数多次触发,并允许直接转到下一张幻灯片,而无需play()函数的初始延迟。为了将来参考,您不必在滑块设置中添加功能。如果要在将鼠标悬停在页面上的任何元素上时暂停滑块,可以添加类似的内容:
$hoveredElement.on('focusin', function() {
$slider.slick('slickPause');
});
或在悬停时恢复自动播放:
$hoveredElement.on('focusin', function() {
$slider.slick('slickPlay');
});
所有这些都假设您首先声明了
$slider
设置 将此作为响应,并将其标记为已解决,以便更具可读性。谢谢你。谢谢你让我知道。