How to run a code on mouseenter event in jQuery ?
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= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </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>w3wiki</h1> <h3> How to run a code on mouseenter event in jQuery? </h3> </div> </body> </html> |
Output:
Contact Us