The hover is a Jquery Event Method. It occur when we click on an element. It executes two functions mouseover and mouseout. When we run over the selected item with the mouse pointer the hover() method triggers both the mouseenter and mouseleave events.



Parameter: It accepts two parameters which are specified below-

  • inFunction: It specifies the function to run when the mouse-enter event occurs.
  • outFunction: It is optional and specifies the function to run when the mouse-leave event occurs.



		<!-- jQuery code to show the working of hover() method -->
		$(document).ready(function() { 
			$("p").hover(function() { 
				$(this).css("background-color", "green"); 
			}, function() { 
				$(this).css("background-color", "yellow"); 
		p { 
			width: 55%; 
			height: 80px; 
			padding: 20px; 
			margin: 10px; 
			border: 2px solid green; 
			font-size: 50px; 

	<!--move the mouse in and out over this paragraph 
		and background color will change-->
	<p>Atemon !</p>