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

Question

Я внедрил следующий код на сайте, над которым я работаю, который отлично работает, но по какой-то причине не работает на Mobile Safari , Когда пользователь щелкает за пределами div #trailer, предполагается, что #screenoverlay, который действует как затемняющий оверлей в стиле лайтбокса, должен исчезнуть, и трейлер должен приостановить (через API vimeo). Однако на 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

, если у вас есть что dakening слой, то почему бы не установить OnClick слушателя по этому поводу?

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