Скрыть диалоговое окно JqueryUI на мобильных браузерах

Question

У меня есть диалоговое окно jqueryUI, которое открывается в pageload. Очень просто, очень просто:

<script> 
$(function() { 
    $("#dialog-modal").dialog({ 
    dialogClass: 'fixed-dialog', 
    resizable: false, 
    width: 580, 
    top: 200, 
    modal: true 
    }); 
}); 
</script> 

<div class="dialog-wrapper"></div> 

<script> 
$('.dialog-wrapper') 
    .html('<div id="dialog-modal" class="dialog-right bigdialog" title="Click to close"><a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=YNQGF43QJK2VG" target="_blank"><img class="overlay-image" src="/images/digger-24k-anim.gif"></a></div>'); 
</script> 

Проблема заключается в том, я хотел бы, чтобы скрыть это на мобильных браузерах, но это не работает вообще. Любые попытки использовать запрос css media для отображения: ни один из определенных разрешений монитора не получает, поскольку стиль элемента на jquery-ui отображается: block;

Любой другой способ достичь этого?

Answer 1

Проверьте размер экрана. Если это меньше минимального размера, пропустите диалог.

if($(window).height() >= miniumHeight && $(window).width() >= minimumWidth) { 
    /*Show Dialog Box*/ 
} else { 
    /*Do Something Else*/ 
} 

Другой способ будет CSS visibility: hidden;