久久无码中文字幕_日韩精品无码一本二本三_久久精品呦女暗网_欧美一级夜夜爽_久久精品国产99久久99久久久

21
2018/07

遮蓋層效果及彈窗過高時的實(shí)現(xiàn)方法

發(fā)布時間:2018-07-21 11:05:30
發(fā)布者:chaobai
瀏覽量:
0

在我們前端開發(fā)過程中,有時可能會需要添加遮蓋層彈窗,如:彈窗登錄、搜索、詳情圖片、內(nèi)容詳情等功能,這時遮蓋彈窗我們可以使用position: fixed;的方式來實(shí)現(xiàn)遮蓋層效果。css設(shè)置方法如下:

遮蓋層效果及彈窗過高時的實(shí)現(xiàn)方法

這樣遮蓋層效果就實(shí)現(xiàn)了,但有時候我們會遇到一些特殊情況,比如彈窗中的內(nèi)容信息很多,彈窗高度很高超出其底部body的高度,這樣就會出現(xiàn)底部超出留白的情況,我們應(yīng)該怎樣處理呢?我在遇到這個問題時,尋找了許多方法,但是基本上都是華而不實(shí),最后的解決方法卻是樸實(shí)無華。

實(shí)現(xiàn)思路:出現(xiàn)這種情況后,我們需要思考其最本質(zhì)的問題是什么,這樣我們從最本質(zhì)的問題出發(fā)就找到了最簡單的實(shí)現(xiàn)方法。像遮蓋層彈窗超出時,我想到的是:

1.怎樣能夠讓遮蓋層不影響到其底部body

2.鼠標(biāo)滾動是其底部頁面滾動,怎樣取消其滾動效果

3.怎樣讓遮蓋層滾動

4.最后發(fā)現(xiàn)要實(shí)現(xiàn)的就是:取消body滾動條、遮蓋層添加滾動條

遮蓋層效果及彈窗過高時的實(shí)現(xiàn)方法

關(guān)鍵詞:
返回列表