In this article, we will see how to run the code when the mouse enters into the specific area using jQuery. To run the code on a mouse enter a specific area, mouseenter() method is used. The mouseenter() method works when the mouse pointer moves over the selected element.
Syntax:
$(selector).mouseenter(function)
Parameters: This method accepts single parameter function which is optional. It is used to specify the function to run when the mouseenter() method is called.
Example:
HTML
<!DOCTYPE html>
< html >
< head >
< title >
How to run a code on mouseenter
event in jQuery?
</ title >
< script src =
</ script >
< script >
$(document).ready(function () {
$(".main").mouseenter(function () {
$(".main").css({
background: "green",
color: "white"
});
});
});
</ script >
< style >
body {
text-align: center;
}
.main {
width: 300px;
height: 200px;
border: 2px solid black;
}
</ style >
</ head >
< body >
< div class = "main" >
< h1 >GeeksforGeeks</ h1 >
< h3 >
How to run a code on mouseenter
event in jQuery?
</ h3 >
</ div >
</ body >
</ html >
|
Output:
