防止頁面滾動條打開彈出框

因此，我知道這類問題以前已經提過很多次，但我找不到適合我的問題的答案。我有一個網站頁面，有很多可滾動的數據，包括圖像。現在我想要一個功能，當我點擊圖像時，圖像在模式彈出窗口中打開，頁面滾動被禁用。就像Facebook一樣，但如果圖像大於屏幕尺寸，則可能會滾動。謝謝您的幫助！！防止頁面滾動條打開彈出框

來源

2013-11-22 theRev

請告訴我你的問題，是它的滾動條或沒有滾動條？您的標題和內容令人困惑。 – Praveen

我在頁面上有很好的數據長度，但是在打開模式彈出窗口時，應該禁用整個頁面的滾動條。由於模式彈出窗口的高度大於視口高度，所以只有很多部分可以滾動（這樣用戶就可以通過滾動查看整個彈出窗口了），我希望你這次得到它 – theRev

首先，如果圖像大於屏幕，您可以檢查屏幕大小並比較圖像。如果圖像較大，請將圖像寬度設置爲屏幕寬度。高度將自動改變以保持比例。

如果高度大於屏幕高度，請按照高度操作。

而對於禁用滾動條，有一個使用JavaScript的長迂迴方法。

否則，您可以隱藏滾動條，並添加一個div，這是圖像後面的全屏幕大小。

迂迴的JavaScript做它的方式：

一旦你點擊圖片，你可以設置車身寬度和高度的屏幕和設置溢出的寬度和高度：藏在身上，當你關閉圖像時，將樣式恢復爲原始樣式。如果身體沒有身高，請將其設置爲自動。

希望這有助於

來源

2013-11-22 07:45:22

感謝phillip-juan，雖然我得到了禁用滾動條的迂迴方式，我在彈出窗口中顯示的圖像特別大（大於屏幕尺寸），我想要這種方式，我不希望它們適合在屏幕上。 ...謝謝!! – theRev

如果你這樣做，你可以使高度和屏幕一樣大，然後使寬度大於屏幕寬度，這種方法你可以左右滾動如果是這樣，你可以將圖像放在一個div中，只需將div放在固定的位置，div上的溢出設置可以進行滾動，你甚至可以添加點擊和拖拽，這取決於你想要什麼... –

非常感謝，建議工作！ – theRev

防止頁面滾動條打開彈出框

回答

相關問題