09.02.2015 Views

DOM Traversal Methods - MarkMail

DOM Traversal Methods - MarkMail

DOM Traversal Methods - MarkMail

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

Event <strong>Methods</strong><br />

Return Value<br />

The jQuery object, for chaining purposes.<br />

Description<br />

The .hover() method binds handlers for both mouseover and mouseout events.<br />

We can use it to simply apply behavior to an element during the time the mouse is<br />

within the element. Consider the HTML:<br />

Move Here<br />

Now we can bind handlers to both entering the element and leaving it with a single<br />

method call:<br />

$('.target').hover(function() {<br />

$(this).log('Hover event was triggered (entering).');<br />

}, function() {<br />

$(this).log('Hover event was triggered (leaving).');<br />

});<br />

Now the first message will be displayed when the mouse pointer enters the element,<br />

and the second will be displayed when the mouse pointer leaves.<br />

With the mouseover and mouseout events, it is common to receive false positives<br />

due to event bubbling. When the mouse pointer crosses over a nested element,<br />

the events are generated and will bubble up to the parent element. The .hover()<br />

method incorporates code to check for this situation and do nothing, so we can safely<br />

ignore this problem when using the .hover() shortcut.<br />

.mousemove()<br />

Binds an event handler to the mousemove JavaScript event, or triggers that event<br />

on an element.<br />

.mousemove(handler)<br />

.mousemove()<br />

Parameters (First Version)<br />

• handler: A function to execute each time the event is triggered<br />

Return Value<br />

The jQuery object, for chaining purposes.<br />

[ 116 ]

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!