jQuery image gallery preview image popup
Posted
by
JV10
on Stack Overflow
See other posts from Stack Overflow
or by JV10
Published on 2012-11-05T04:13:15Z
Indexed on
2012/11/05
5:00 UTC
Read the original article
Hit count: 300
I've created an image gallery with the preview image popup on hover.
Hover over the thumbnail images and the larger image preview displays.
I'm not happy with the way preview images can flash between moving around the thumbnail images. How can I simplify the script and improve the preview image popup?
$(document).ready(function() {
$('.imageGalleryAlbum li a img').mouseenter(function() {
$(this).closest('li').find('.preview').delay(500).fadeIn(1);
$(this).closest('li').siblings().find('.preview').fadeOut(1);
return;
});
$('.imageGalleryAlbum li .preview').hover(function() {
$(this).closest('li').siblings().find('.preview').fadeOut(1);
return;
});
$('.imageGalleryAlbum li .preview').mouseleave(function() {
$(this).closest('li').find('.preview').fadeOut(1);
$(this).closest('li').siblings().find('.preview').fadeOut(1);
return;
});
$('.imageGalleryAlbum li .preview').click(function() {
$(this).closest('li').find('.preview').fadeOut(1);
$(this).closest('li').siblings().find('.preview').fadeOut(1);
return;
});
});
$(document).mouseup(function(e) {
var container = $(".preview");
if (container.has(e.target).length === 0) {
container.fadeOut(1);
}
});?
© Stack Overflow or respective owner