jQuery Event - mouseout() Method

Example

Change the background color of the element when the mouse is moved away from it:

$("p").mouseout(function(){
  $("p").css("background-color","#E9E9E4");
});

Try it yourself

Definition and Usage

The mouseout event occurs when the mouse pointer is moved away from the element.

This event is most often used with mouseover events together.

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

Note:Unlike the mouseleave event, the mouseout event is triggered regardless of whether the mouse pointer leaves the selected element or any of its child elements. The mouseleave event is only triggered when the mouse pointer leaves the selected element. Please see the demonstration in the following example.

Try it yourself:The difference between mouseleave and mouseout

Trigger the mouseout event

Syntax

$(selector).mouseout()

Try it yourself

Bind the function to the mouseout event

Syntax

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

Try it yourself