fixed元素遮擋下面元素的問題

2021-08-29 02:24:15 字數 759 閱讀 3836

網頁實際開發中會遇到fixed置頂元素,有時需要由後端決定是否顯示。

所以在布局上注意fixed元素遮擋問題。

具體解決辦法如下:

html

"fixed_wrap"

>

"fixed"

>

fixeddiv

>

div>

"under"

>

underdiv

>

css

#fixed_wrap

#fixed

#under

說明:在fixed元素外包裹乙個wrap元素,然後給wrap元素設定高度/背景色(fixed元素不設定高度)

這種情況一般是在不能修改dom元素,並且fixed元素下方是的情況下,可以先將fixed元素背景設定為透明色(下方是,不算遮擋),在滾動時新增class為fixed元素新增背景色。

js

$

(document)

.scroll

(function()

else})

;

ie 透明元素遮擋的元素仍能響應滑鼠事件

如果乙個元素被另乙個元素遮蓋,不論遮蓋元素的背景色是否是 transparent 也不論遮蓋元素的透明度是否為全透明,被遮蓋元素是不能響應使用者的滑鼠事件的。關於 background color 請參考 w3c css 2.1 規範 14.2.1 background color 中的內容。關於 ...

父級fixed 相對于父元素的fixed定位的實現

問題描述 之前在專案中,遇到了乙個場景,需要實現相對于父元素的fixed定位 在父元素內拖動滾動條時,fixed 定位的元素不能滑動,在外層拖動滾動條時,父元素及父元素內的所有元素跟著一起滑動。但是position fixed是相對於視窗進行的定位,不能直接實現我們需要的效果。在網上搜尋看到乙個還不...

html元素重疊 下面的元素仍然響應事件的解決

其實就是pointer events和elementfrompoint 對於兩個div,div a覆蓋了div b,但是要讓div b能夠接收到滑鼠的事件,有兩種方法 1.在firefox chrome等支援css3瀏覽器中,有個css屬性叫pointer events,設定div a的 point...