Your generous donation allows me to continue developing and updating my code!
With jQuery outside events you can bind to an event that will be triggered only when a specific "originating" event occurs outside the element in question. For example, you can click outside, double-click outside, mouse-over outside, focus outside (and over ten more default "outside" events).
You get the idea, right?
The dblclickoutside event, bound to a few elements
Just click around, and see for yourself!
The code
$(function(){
// Elements on which to bind the event.
var elems = $('#test, #test div, #test .bind-me');
// Clear any previous highlights and text.
$(document)
.bind( 'dblclick', function(event){
elems
.removeClass( 'event-outside' )
.children( '.event-target' )
.text( ' ' );
})
.trigger( 'dblclick' );
// Bind the 'dblclickoutside' event to each test element.
elems.bind( 'dblclickoutside', function(event){
var elem = $(this),
target = $(event.target),
// Update the text to reference the event.target element.
text = 'Double-clicked: ' + target[0].tagName.toLowerCase()
+ ( target.attr('id') ? '#' + target.attr('id')
: target.attr('class') ? '.' + target.attr('class').replace( / /g, '.' )
: ' ' );
// Highlight this element and set its text.
elem
.addClass( 'event-outside' )
.children( '.event-target' )
.text( text );
});
});