На нашем ресурсе вы можете поделиться своими или бесплатно скачать книги для разработчиков на PHP, Mysql, Ajax, Ruby on Rails, C++, Unix, WinApi, C# sharp, .NET, Java, UML, различным Frameworks. 

For the top set, the following script in the ready handler establishes handlers for
the mouse events:

$('#outer1')

.bind('mouseover',report)

.bind('mouseout',report);

This statement establishes a function named

report

as the event handler for both

the mouseover and mouseout events. The

report()

function is defined as follows:

function report(event) {

$('#console').append('<div>'+event.type+'</div>');

}

This listener merely adds a

<div>

element containing the name of the event that

fired to a

<div>

named

console

that's defined at the bottom of the page, allowing

us to see when each event fires.

Now, let's move the mouse pointer into the area labeled Outer 1 (being careful

not to enter Inner 1). We'll see (from looking at the bottom of the page) that a
mouseover event has fired. Move the pointer back out of the area. As expected,
we'll see that a mouseout event has fired.

Let's refresh the page to start over, clearing the console.
Now, move the mouse pointer into Outer 1 (noting the event), but this time

continue inward until the pointer enters Inner 1. As the mouse enters Inner 1, a
mouseout event fires for Outer 1. If we wave our pointer over the inner area, we'll
see a flurry of mouseout and mouseover events. This is the expected behavior.
Even though the pointer is still within the bounds of Outer 1, when the pointer
enters a contained element, the event model considers the transition from the
area of Outer 1 for its contained element to be leaving the outer area.

Expected or not, we don't always want that behavior. Often, we want to be

informed when the pointer leaves the bounds of the outer area and don't care
whether the pointer is over a contained area or not.

We could write our handlers to detect when a mouse event is the result of leav-

ing the area or the result of merely entering a contained element, but luckily we
won't have to. jQuery comes to our aid with the

hover()

command.

The syntax of this command is as follows: