[英]Fancybox: Getting it to work on mouseover/mouseout
I currently have it working halfway by using: 我目前通过以下方式使它工作一半:
jQuery("a.lightbox").fancybox().hover(function() {
jQuery(this).click();
}, function() {
jQuery("#fancybox-overlay").click();
});
When I hover over the thumbnail it works fine, but when I mouseover the background, #fancybox-overlay
it doesnt disable fancybox.. any ideas? 当我将鼠标悬停在缩略图上时,效果很好,但是当我将鼠标悬停在背景上时,
#fancybox-overlay
不会禁用fancybox ..有什么想法吗?
with hoverIntent: 与hoverIntent:
function openFancybox(){
jQuery(this).trigger("click");
}
function closeFancybox(){
jQuery.fancybox.close();
}
jQuery("a.lightbox").hoverIntent({
sensitivity: 100,
interval:250,
timeout:0,
over: openFancybox,
out: closeFancybox
}); // hoverIntent
jQuery("#fancybox-content img").hoverIntent({
sensitivity: 10,
interval:500,
timeout:0,
// over: openFancybox,
out: closeFancybox
}); // hoverIntent
jQuery("a.lightbox").fancybox({
'overlayShow' : false,
'autoScale' : true
}); // fancybox
The Answer: 答案:
HTML HTML
<a href="image1.jpg" class="lightbox" rel="gallery"><img src="image1.jpg"></a>
<a href="image2.jpg" class="lightbox" rel="gallery"><img src="image2.jpg"></a>
JS JS
$("a.lightbox").fancybox({
'showCloseButton': false
}).hover(function() {
$(this).click();
$(".fancybox-overlay").mouseout(function() {
$.fancybox.close();
});
});
use this snippet: 使用以下代码段:
$("a.lightbox").mouseover(function(){
$("a.lightbox:first").trigger("click");
});
do the same with mouseout event ... =) 用mouseout事件做同样的事情... =)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.