Skip to content
This repository has been archived by the owner on Aug 27, 2019. It is now read-only.

Latest commit

 

History

History
39 lines (30 loc) · 750 Bytes

README.md

File metadata and controls

39 lines (30 loc) · 750 Bytes

jquery-after-css-transition

A simple jQuery plugin that help to append CSS classes after CSS transitions or after another CSS class.

You can try it on JSFiddle or view the code below:

CSS code

#dropdown {
	opacity: 1;
	transition: opacity 0.25s ease-out;
}
.hidden {
	display: none;
}
.invisible {
	opacity: 0;
}

jQuery code

$(function() {
    var $area = $("#hover-area");
	var $dropdown = $("#dropdown");

	$area.on("mouseenter", function () {
	    $dropdown.removeClass("hidden").removeClassAfter("invisible");
	});
	
	$area.on("mouseleave", function () {
	    $dropdown.addClass("invisible").addClassAfterTransition("hidden");
	});
});