jQuery BullseyeViewport detection plug-in for jQuery!

A versatile & lightweight plug-in for jQuery that adds enterviewport and leaveviewport events to elements.

Works in all modern browsers

DemosSee jQuery Bullseye in action!

Box 1

Check the output log for events.

Box 2

Check the output log for events.

Box 3

Check the output log for events.

Box 4

Check the output log for events.

Box 5

Check the output log for events.

How to use

Bind any of Bullseye's events. Then initialize Bullseye with bullseye(settings).

Source

// Sample callback function
function logThis(e) {
    alert($(this).attr('id') + ': ' + e.type);
}
// jQuery DOM-Loaded event
$(function() {
    
    $('.bullseye')

    // Bind events
    .bind('viewportenter', logThis)
    .bind('viweportleave', logThis)

    // Initialize Bullseye
    .bullseye();

});

DocumentationHow to use jQuery Bullseye

EventsLets you detect viewport changes

Bullseye extends jQuery so that you can use the following events:

SettingsLets you configure the behaviour of Bullseye

When you call the bullseye-function you can set some options (type - default value):

Known Issues & Limitations

Output