Description

The mouseenter event occurs when the mouse pointer is over an element.

This event is mostly used together with the mouseleave event.

The mouseenter() method triggers the mouseenter event, or if the function parameter is set, it specifies what happens when a mouseenter event occur.

Note: Unlike the mouseover event, the mouseenter event only triggers when the the mouse pointer enters the selected element. The mouseover event is triggered if a mouse pointer enters any child elements as well. See the example at the end of the page for a demonstration.

---

Trigger the Event

Trigger the mouseenter event for the selected element.

This method has the form:

.mouseenter()

Return Value

This form returns a jQuery object.

---

Bind a Function to the Event

Specifies a function to run when the mouseenter event is triggered for the selected element.

This method has the alternate form:

.mouseenter(function)

Parameter	Description
function	(optional) Specifies the function to run when the mouseenter event is triggered

Return Value

This form returns a jQuery object.

---

This method has the alternate form:

.mouseenter(data,function)

Parameter	Description
data	(optional) Specifies additional data to pass along to the function
function	(optional) Specifies the function to run when the mouseenter event is triggered

Return Value

This form returns a jQuery object.

Examples

Change background color of an element when the mouse pointer enters it:

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