遮罩層上滾動,使下方的列表隨之滾動

2021-08-21 19:52:48 字數 616 閱讀 2983

遮罩層為一張邊框樣式圖(如下圖):

邊框樣式遮罩層顯示在最上方,然後是中間的列表,最下層是乙個透明黑色遮罩層,滾動滑鼠滾輪,能控制列表滾動

註冊最上面遮罩層的滾動事件,拿到滾動滾動方向,然後控制列表滾動的方向和距離

註冊事件

/** * 增加滾輪滾動事件(暫時只實現了chrome的滾動效果)

*@param modaldomid 遮罩層domid

*@param domid 需要滾動下層列表domid

*/addmousewheellistener(modaldomid:string,domid:string)

else

}//向下滾

else

}});

}元件呼叫:

this.addmousewheellistener("你的最上方遮罩層id","你想要滾動的列表id");

遮罩層 彈框 頁面滾動

第一種情況比較簡單,彈框和頁面都不可滾動 mask boxvar obtn document.getelementbyid btn omask document.getelementbyid mask obox document.getelementbyid box oclose document....

vue 遮罩層阻止預設滾動事件

ref picker type date year format 年 month format 月 startdate startdate v model selectedmonth confirm monthconfirm touchmove.native.stop.prevent 阻止單擊事件繼...

移動端 pc端,遮罩層滾動穿透問題

常見的解決方式有一下三種 model open遮罩層顯示時將 modal open 新增到 html上,刪除多餘一頁的部分,禁止頁面滾動。遮罩層隱藏時,移除.modal open,恢復頁面滾動即可 缺點 實現滾動條無法滾動 var mo function e 禁止滑動 function stop 取...