CSS/jQuery的防止滾動某些股利

我有這樣的HTML代碼：CSS/jQuery的防止滾動某些股利

<div class="parentDisable"></div> 
<div id="popup"> 
    <div class="karmalayer"> 
     <img src="<?php echo(IMG) ?>alpha-shadow.png"> 
     Thank you for visiting 
    </div> 
</div>

具有以下屬性：

.karmawrapper { 
    position: absolute; 
    z-index: 10001; 
    width: 100%; 
} 

.karmalayer { 
    margin: 0 auto; 
    display: block; 
    background-color: #000; 
    width: 500px; 
    height: 300px; 
    border: 2px solid #337ab7; 
    color: #fff; 
    padding: 20px; 
    font-size: 18px; 
} 

.hlcolor { 
    color: #337ab7; 
} 

.karmalayer img { 
    margin: 0 auto; 
    display: block; 
} 

.parentDisable{ 
    position:fixed; 
    top:0; 
    left:0; 
    background:#000; 
    opacity:0.8; 
    z-index:10000; 
    height:100%; 
    width:100%; 
} 

#popup{ 
    position: absolute; 
    z-index:10001; 
    width: 100%; 
    display: none; 
    text-align: center; 
}

這是爲「禁用」我的背景上打開網頁，並顯示一個彈出。由於我的網站已經在後臺加載（而且網站相當長），我想禁用滾動功能。基本上，只要用戶在div popup中，就不應允許滾動。

我試圖用jQuery解決這個問題，但沒有做的伎倆：

$(document).bind('mousewheel', function (event) { 
    event.preventDefault(); 
    var delta = event.originalEvent.wheelDelta || -event.originalEvent.detail; 
    init_scroll(event, delta); 
});

任何想法？

來源

2015-08-20 DasSaffe

要使內容不可滾動，請將其包裝在容器中，並將其設置爲隱藏狀態。容器需要一個固定的高度，因此將位置設置爲絕對值並將高度/寬度設置爲100％應填滿屏幕，通常您會希望頁面內容如何。這將防止滾動條出現並防止默認滾輪動作。在顯示內容之前檢查頁面何時加載。另外，如果你的頁面有這麼多的內容，也許把它分成多個頁面就足夠了？或者，只有當用戶滾動到ajax時才加載內容。

來源

2015-08-20 22:24:19

CSS/jQuery的防止滾動某些股利

回答

相關問題