首頁 > web前端 > html教學 > 如何阻止遮罩層後頁面滾動的實例

如何阻止遮罩層後頁面滾動的實例

黄舟
發布: 2017-10-24 10:36:01
原創
2454 人瀏覽過


一:頁面會初始化到頂端,而後靜止
css程式碼:

.ovfHiden{overflow: hidden;height: 100%;}
登入後複製

jquery:

$(".header_right").click(function(){$('html,body').addClass('ovfHiden'); //使网页不可滚动
   $(".searchbox").show();
 })
 $(".yg-close").click(function(){
   $('html,body').removeClass('ovfHiden'); //使网页恢复可滚
   $(".searchbox").hide();
 })
登入後複製

二:頁面正常靜止
1.開啟新頁面時需要禁止滑鼠滾輪,禁止頁面滑動;
在呼叫顯示圖層時加上這句js程式碼就可以了:

document.documentElement.style.overflow = "hidden";
登入後複製


關閉層的時間別忘了在加上這句話:

document.documentElement.style.overflow = "scroll";
登入後複製



2.設定滾輪原來位置

var top_temp = $(document).scrollTop()||document.documentElement.scrollTop || document.body.scrollTop;
window.parent.scrollTo(0,top_value);
登入後複製

以上是如何阻止遮罩層後頁面滾動的實例的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板