mouseleave

Syntax


.mouseleave(handler)            
.mouseleave()
handler
A function to execute each time the event is triggered

Return value

The jQuery object, for chaining purposes.

Description

Bind an event handler to be fired when the mouse leaves an element, or trigger that handler on an element.

.mouseleave(handler) is a shortcut for .bind('mouseleave', handler), .mouseleave() is a shortcut for .trigger('mouseleave').

We can also trigger the event when another element is clicked.


$('#other').click(function() {

 $('#outer').mouseleave();

});

Cascaded Mouse leave event

 
<html>
  <head>
    <script src="http://java2s.com/Book/JavaScriptDemo/jQuery/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("div").mouseover(function(){
                $(this).append('<span style="color:#F00;">mouseover.</span>');
            }).mouseleave(function(){
                $(this).append('<span style="color:#00F;">mouseleave</span>');
            });
        });
    </script>
  </head>
  <body>
    <body>
     <div>adsf</div>
    </body>
</html>
Click to view the demo
Home 
  JavaScript Book 
    jQuery  

Event:
  1. jQuery Event
  2. jQuery's methods for event
  3. Event object
  4. event.keycode
  5. event.clientX/clientY
  6. event.pageX/pageY: click event coordinates
  7. event.preventDefault()
  8. event.stopPropagation(): Stop only an event from bubbling by using the stopPropagation method.
  9. event.target.tagName
  10. event.which:check key code
  11. return false to Cancel a default action and prevent it from bubbling up
  12. bind
  13. .blur()
  14. .change()
  15. .click()
  16. .error()
  17. .dblclick()
  18. .delegate()
  19. die:Removes a bound live event
  20. .focus()
  21. .hover()
  22. keydown() event
  23. .keypress()
  24. keyup event and check the key code
  25. .live()
  26. .load()
  27. mousedown() event
  28. mouseenter() event
  29. mouseleave
  30. mousemove()
  31. mouseover() event
  32. mouseout
  33. mouseup() event
  34. .off() removes events
  35. .on() replaces the functionality of all the event methods.
  36. .one() method executes handler only once.
  37. .ready()
  38. .resize()
  39. .scroll()
  40. .select()
  41. .submit()
  42. .toggle()
  43. .trigger()
  44. .triggerHandler()
  45. .unbind() accepts a string describing the event type to unbind.
  46. .undelegate() removes the binding
  47. .unload()
  48. use bind/trigger to create custom event