jquery對話框 - 推背景內容

我有一個奇怪的問題與jquery對話框彈出，我希望有人在這裏可以提供幫助。彈出代碼如下所示。除了一件事以外，它工作正常。當顯示彈出窗口時，它有時會將背景內容向下移動大約對話窗口的高度。有沒有辦法防止這種情況發生？jquery對話框 - 推背景內容

$("#searchPopUp").dialog({ 
    modal: true, 
    bgiframe: false, 
    autoOpen: false, 
    resizable: true, 
    position:{ my: "center", at: "center", of: window }, 
    title: 'Choose one search criteria and<br/>populate the corresponding field below:', 
    width: 400, 
    close: function(event, ui) {}, 
    buttons: { 
     "Search": function() { 
      $("#viewDevicesSearchForm\\:searchCommandLink").click(); 
     }, 
     "Close": function() { 
      $(this).dialog("close"); 
     } 
} 
});

Before Dialog widow

After Dialog window - Notice the background table is being pushed down a bit

來源

2013-08-06 HockChai Lim

嘗試更改bgiframe：爲true？如果這不起作用，你可以張貼小提琴嗎？很難想象你到底在說什麼，甚至是在測試一個修補程序。 – Rooster

將bgiframe更改爲true後仍然執行相同的操作。我添加了一張之前和之後的圖片，通過推送內容來顯示我的意思。在後圖中，您可以看到背景表與頁面頂部之間的很大差距。 –

這是特定於瀏覽器的？ – Rooster

這是因爲jQuery設置位置相對，然後使用頂部和左側移動彈出到合適的位置。我發現了兩種方法來解決這個問題：

1）容易的兩個：將對話框容器的底部邊緣設置爲負高度。

popup.dialog({ 
      ...other options..., 

      open : function() { 
       popup.css('margin-bottom', 0 - popup.height()); 
      }, 
     });

2）對於對話框容器，將位置設置爲絕對值並調整頂部和左側。爲了把它放在正確的位置，將它放置的位置的偏移位置添加到jquery設置的最高值。左邊的計算是相似的。這應該這樣做，但對話框的不同參數可能需要不同的計算。

來源

2016-03-03 10:40:12

jquery對話框 - 推背景內容

回答

相關問題