The hover() is an inbuilt method in jQuery which is used to specify two functions to start when mouse pointer move over the selected element.
Syntax:
$(selector).hover(Function_in, Function_out);
Here selector is the selected element.
Parameter: It accepts two parameters which are specified below-
- Function_in: It specifies the function to run when the mouse-enter event occurs.
- Function_out: It is optional and specifies the function to run when the mouse-leave event occurs.
Return Value: It returns the background color effect with the selected element.
Code #1:
< html > < head > < script </ script > < script > <!-- 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"); }); }); </ script > < style > p { width: 55%; height: 80px; padding: 20px; margin: 10px; border: 2px solid green; font-size: 50px; } </ style > </ head > < body > <!--move the mouse in and out over this paragraph and background color will change--> < p >GeeksforGeeks !</ p > </ body > </ html > |
Output:
Before mouse pointer is moved over the paragraph-
After mouse pointer is moved over the paragraph-
After mouse pointer is moved out from the paragraph-
leave a comment
0 Comments