js 靜止滾輪 js禁止頁面滾動

2021-10-12 14:08:57 字數 571 閱讀 2950

開發移動端頁面的時候有乙個很比較常見的需求,在出現彈窗時,禁止滑動彈窗後面的主體頁面。如何實現呢,往下看

js實現整個頁面禁止滾動:

document.body.addeventlistener('touchmove', function(e), ); //passive 引數不能省略,用來相容ios和android

passive是幹嗎用的呢,設定該屬性的目的主要是為了在阻止事件預設行為導致的卡頓。等待***的執行是耗時的,有些甚至耗時很明顯,這樣就會導致頁面卡頓。即便***是個空函式,也會產生一定的卡頓,畢竟空函式的執行也會耗時。加上能防止頁面卡頓。

我們可以通過傳遞 passive 為 true 來明確告訴瀏覽器,事件處理程式不會呼叫 preventdefault 來阻止預設滑動行為。如果設定了passive為true,同時又阻止預設行為,阻止是不生效的

document.addeventlistener("touchmove", function(event) , );

vue裡面直接在html模板裡處理:

//如果在這個div中滑動,觸發的事件會經過showselect,可以阻止被該彈框蓋在下面的頁面滑動

js禁止蘋果頁面底部滾動 js 禁止 允許頁面滾動

出處 方法一 ios允許滾動會無效 function scrcontrol t passive 引數不能省略,用來相容ios和android else if t 1 passive,設定該屬性的目的主要是為了在阻止事件預設行為導致的卡頓。等待 的執行是耗時的,有些甚至耗時很明顯,這樣就會導致頁面卡頓...

js如何禁止頁面回退

js本身是無法禁止頁面回退的,但是我們可以通過一些特殊操作來達到這個效果,我們主要用到 為瀏覽器加乙個當前 的歷史記錄,這樣當點選回退時,就會回到當前頁面,相當於沒回退,然後給使用者的感覺就是沒有回退 window.history.pushstate null,null,document.url 首...

js跑馬燈 頁面滾動

既然沒有優人的天賦,那就拼吧!先看下效果 部分 class newstip up style color red font size 26px 民法典 生效啦,相關民法典內容已上線p style color red font size 26px 民法典 生效啦,相關民法典內容已上線p 螢幕滾動 fu...