W3Schools.com

jQuery Event mouseout() Method

jQuery Event Methods jQuery Event Methods

Example

Change background color of an element when the mouse pointer is removed 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 removed from an element.

This event is mostly used together with the mouseover event.

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

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

Trigger the mouseout Event

Trigger the mouseout event for the selected element.

Syntax

$(selector).mouseout()

Try it yourself »

Bind a Function to the mouseout Event

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

Syntax

$(selector).mouseout(function)

Try it yourself »

Parameter Description
function Optional. Specifies the function to run when the mouseout event is triggered.

Examples

Try it Yourself - Examples

The difference between mouseout and mouseleave
Demonstrates the difference between mouseout and mouseleave.

jQuery Event Methods jQuery Event Methods

WEB HOSTING
Best Web Hosting
PHP MySQL Hosting
Best Hosting Coupons
UK Reseller Hosting
Cloud Hosting
Top Web Hosting
$3.98 Unlimited Hosting
Premium Website Design
WEB BUILDING
XML Editor - Free Trial!
FREE Website BUILDER
Best Website Templates Top CSS Templates
CREATE HTML Websites
EASY WEBSITE BUILDER
W3SCHOOLS EXAMS
Get Certified in:
HTML, CSS, JavaScript, XML, PHP, and ASP
W3SCHOOLS BOOKS
New Books:
HTML, CSS
JavaScript, and Ajax
STATISTICS
Browser Statistics
Browser OS
Browser Display
SHARE THIS PAGE