jQuery Event - mouseover() Method

Example

Change the background color of the element when the mouse pointer is above it:

$("p").mouseover(function(){
  $("p").css("background-color","yellow");
});

Try it yourself

Definition and usage

The mouseover event occurs when the mouse pointer is above the element.

This event is often used with mouseout events together.

The mouseover() method triggers the mouseover event, or specifies the function to be executed when a mouseover event occurs.

Note:Unlike the mouseenter event, the mouseover event will be triggered regardless of whether the mouse pointer passes through the selected element or its child elements. The mouseenter event will only be triggered when the mouse pointer passes through the selected element. Please see the demonstration in the following example.

Try it yourself:Difference between mouseenter and mouseover

Trigger the mouseover event

Syntax

$(selector).mouseover()

Try it yourself

Bind the function to the mouseover event

Syntax

$(selector).mouseover(function)
Parameters Description
function Optional. Specifies the function to be executed when a mouseover event occurs.

Try it yourself