ユーザーがページを移動したときにライトボックスがトリガーする

Question

私は助けを求めます。私はtonyleaからの単純なライトボックスのポップアップをコピーしました。

私がライトボックスをユーザがページを飛び越したときにトリガーしたいと思っていました。現在のところ、クリックしてトリガーをかけることができます。

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

これを行う方法についてご意見はありますか？

Answer 1

jQueryを使用すると、documentのmouseleaveイベントを監視できます。

$(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>