How to run code on mouseleave event in jQuery ?
In this article, we will see how to run the code when the mouse leaves into a specific area using jQuery. To run the code on a mouse leave into a specific area, the mouseleave() method is used. The mouseleave() method works when the mouse pointer leaves the selected element.
Syntax:
$(selector).mouseleave(function)
Parameters: This method accepts a single parameter function which is optional. It is used to specify the function to run when the mouseleave event is called.
Example:
HTML
<!DOCTYPE html>
< html >
< head >
< title >
How to run code on mouseleave
event in jQuery ?
</ title >
< script src =
</ script >
< script >
$(document).ready(function() {
$(".main").mouseleave(function() {
$(".main").css({
background: "green",
color: "white"
});
});
$(".main").mouseenter(function() {
$(".main").css({
background: "none",
color: "black"
});
});
});
</ script >
< style >
.main {
width: 300px;
height: 200px;
border: 2px solid black;
}
</ style >
</ head >
< body >
< center >
< div class = "main" >
< h1 >GeeksforGeeks</ h1 >
< h3 >
How to run code on mouseleave
event in jQuery ?
</ h3 >
</ div >
</ center >
</ body >
</ html >
|
Output:
Last Updated :
05 Jun, 2023
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...