Home >>jQuery Tutorial >jQuery mouseover() Method

jQuery mouseover() Method

jQuery mouseover() Method

jQuery mouseover() method in jQuery is used to add a function or triggers the mouseover event to run when the mouse pointer is over the selected element.

Syntax:

Trigger the mouseover event for the selected elements:

$(selector).mouseover()

Attach a function to the mouseover event:

$(selector).mouseover(function) 

Parameter Values

Parameter Description
function It is an optional parameter and is used to specifies the function to run when the mouseover event is triggered
Here is an Example of jQuery mouseover() Method:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".txt1").mouseover(function(){
$(".txt1").css("background-color", "orange");
});
$(".txt1").mouseout(function(){
$(".txt1").css("background-color", "lightgreen");
});
});
</script>
</head>
<body>
<p class="txt1">Move the mouse pointer over me !</p>
</body>
</html>

Output:

Move the mouse pointer over me !