隱藏移動瀏覽器上的JqueryUI對話框窗口

Question

我有一個jqueryUI對話窗口，在頁面載入時打開。很簡單，很容易：

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

問題是，我想隱藏在移動瀏覽器上，但它根本不工作。由於jquery-ui上的元素樣式是display：block;因此，在某些顯示器分辨率下使用css媒體查詢顯示：none的任何嘗試都不會被拾取。

有沒有其他辦法可以達到這個目的？

Answer 1

檢查屏幕的大小。如果它小於最小大小，則跳過對話框。

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

另一種方式將是CSS visibility: hidden;