jQuery mouseover()

The mouseover event is occurred when you put your mouse cursor over the selected element .Once the mouseover event is occurred, it executes the mouseover () method or attach a function to run.

This event is generally used with mouseout() event.

Note: Most of the people are confused between mouseenter and mouseover.

Difference between mouseenter() and mouseover()

The mouseenter event is only triggered if the mouse pointer enters the selected element whereas the mouseover event triggers if the mouse cursor enters any child elements as well as the selected element.

Syntax:

It triggers the mouseover event for selected elements.

It adds a function to the mouseover event.

Parameters of jQuery mouseover() event

ParameterDescription
FunctionIt is an optional parameter. It executes itself when the mouseover event is triggered.

Example of jQuery mouseover() event

Let's take an example to demonstrate jQuery mouseover() event.

Test it Now

Output:

Move your cursor over this paragraph.


jQuery mouseover() event example 2

Let's see another example of jQuery mouseover() event.

Test it Now

Output:

move your mouse