Lightbox wird ausgelöst, wenn der Benutzer die Seite verlässt

Question

Ich möchte um Hilfe bitten. Ich kopierte ein einfaches Leuchtkasten Popup, das von tonylea ist.

Ich wollte meine Lightbox auslösen, wenn Benutzer von der Seite schwebt. Derzeit kann es durch einen Klick ausgelöst werden.

$('.lightbox').click(function(){ 
    $('.backdrop, .box').animate({'opacity':'.50'}, 300, 'linear'); 
    $('.box').animate({'opacity':'1.00'}, 300, 'linear'); 
    $('.backdrop, .box').css('display', 'block'); 
}); 

Haben Sie Vorschläge, wie Sie das erreichen können?

Answer 1

Mit jQuery können Sie das Ereignis mouseleave unter document überwachen.

$(document).on('mouseleave', function() { 
 
    $('.backdrop, .box').animate({ 
 
    'opacity': '.50' 
 
    }, 300, 'linear'); 
 
    $('.box').animate({ 
 
    'opacity': '1.00' 
 
    }, 300, 'linear'); 
 
    $('.backdrop, .box').css('display', 'block'); 
 
    console.log('mouse left'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>