скрыть DIV, когда пользователь нажимает вне его на iPhone / iPad / мобильном сафари

Question

На сайте, над которым я работаю, я реализовал следующий код, который прекрасно работает, но по некоторым причинам, похоже, не работает в Mobile Safari.Когда пользователь щелкает вне #trailer div, #screenoverlay, который действует как затемнение типа лайтбокса, должен исчезнуть, а трейлер должен остановиться (через vimeo API).Однако на iPad это не работает, и я подозреваю, что это возможно, потому что код mouse_is_inside не работает на мобильных устройствах?Есть ли альтернативный способ достижения того же эффекта или способ изменить этот код?Любая помощь будет фантастической!

var mouse_is_inside = false;

$(document).ready(function()
{
$("#trailer").hover(function(){ 
    mouse_is_inside=true; 
}, function(){ 
    mouse_is_inside=false; 
});

$("body").mouseup(function(){ 
    if(! mouse_is_inside) $("#screenoverlay").fadeOut();
    froogaloop.api('pause');
});
});

И страница здесь http://tinyurl.com/d2zttye

Answer 1

, если у вас есть этот слой темного света, то почему бы не установить на него прослушиватель onclick?

$("#screenoverlay ").onclick(function(){
    $("#screenoverlay").fadeOut();
});