Quick Reach
jQuery mouseleave() method
The mouseleave event occurs when mouse leaves, the pointer of mouse, the selected element. For example a paragraph, div. The mouseleave() method is used to perform certain action as mouseleave event takes place.
mouseleave is generally used with mouseenter event.
/*
Syntax
$(selector). mouseleave(function)
Where function is optional. It runs as double click event occurs.
e.g.
$(“p”). mouseleave(function)
$(“div”). mouseleave(function)
$(“button”). mouseleave(function)
Below is running examples of mouseleave() method with <p> HTML element.
Experience this example online
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | <!DOCTYPE html> <head> <title>jQuery Events</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript" language="javascript"> $(document).ready(function(){ $("#mouseevent").mouseleave(function(){ $("#mouseevent").css("background-color","red"); }); }); </script> <style type="text/css"> .stylespec{ background-color:#00ffff; width:400px; height:50px; border-style: solid; border-width: 1px; } </style> </head> <body> <p class="stylespec" id="mouseevent">As mouse leaves this parapgraph background color will be changed!</p> </body> </html> |
Also see jQuery click
Leave A Comment?