(function($) { function hideAll() { $(".description:visible").each(function() { $(this).hide("slide", { direction: $(this).attr("data-slide-dir") }, 250); }); $(".overlay-active").fadeOut(); $(".overlay-inactive").fadeOut(); } function showWrapper(wrapper) { $(wrapper).children(".overlay-inactive").first().fadeOut(); $(wrapper).children(".overlay-active").first().fadeIn(); var description = $(wrapper).children(".description").first(); if ($(description).is(":hidden")) { description.show("slide", { direction: description.attr("data-slide-dir") }, 250); } } $(document).ready(function() { var hideAllTimeout; var showTimeout; $(".wrapper").hover( function(eventObject) { clearTimeout(hideAllTimeout); var hover_wrapper = $(eventObject.target).closest(".wrapper").first(); $(".overlay-inactive").each(function() { var overlay = $(this); if (overlay.parent(".wrapper")[0].id != $(hover_wrapper)[0].id) { // Make sure this description is hidden var desc = overlay.next(".description"); $(desc).stop(); if ($(desc).is(":visible")) { $(desc).hide("slide", { direction: $(desc).attr("data-slide-dir") }, 250); } // Show the overlay overlay.fadeIn(400, function() { // Make absolutely certain that the description is hidden var desc = overlay.next(".description"); $(desc).stop(); if ($(desc).is(":visible")) { $(desc).hide("slide", { direction: $(desc).attr("data-slide-dir") }, 250); } }); } }); $(".overlay-active").fadeOut(); showTimeout = setTimeout(function() { showWrapper(hover_wrapper); }, 250); }, function(eventObject) { clearTimeout(showTimeout); hideAllTimeout = setTimeout(hideAll, 250); }); }); })(jQuery);