問題描述

如圖，白色背景框?yàn)楦冈兀詣?dòng)設(shè)置了overflow:hidden （某滾動(dòng)條插件影響）。 其中有一個(gè)上傳控件，左邊的黑塊是此控件的偽元素，這個(gè)偽元素是根據(jù)這個(gè)控件來定位的。但是它會(huì)被父元素自動(dòng)地截?cái)嗔恕Ｕ?qǐng)問是否能使其不受overflow影響？

做出類似下面的

簡(jiǎn)單做了個(gè)類似的，大家?guī)兔纯磆ttps://jsfiddle.net/zmL145ks/

問題解答

不能的，overflow 生成了一個(gè)bfc，其層疊順序的權(quán)重較高，position的absolute的權(quán)重不如它高。

absolute絕對(duì)定位元素，如果含有overflow不為visible的父級(jí)元素，同時(shí)，該父級(jí)元素以及到該絕對(duì)定位元素之間任何嵌套元素都沒有position為非static屬性的聲明，則overflow對(duì)該absolute元素不起作用。

給你兩篇資料參考一下http://www.zhangxinxu.com/wor...http://www.zhangxinxu.com/wor...

更新

transform + overflow + fixed定位進(jìn)行了實(shí)現(xiàn)。https://jsfiddle.net/vpgL5535/4/

把overflow 干掉后的position 定位https://jsfiddle.net/vpgL5535/3/

。。。你把overflow:hidden去了。要不然就別讓他在這個(gè)父元素里面。。用absolute絕對(duì)定位

可以通過設(shè)置 position屬性處理，

http://www.zhangxinxu.com/stu...

如果你不能手動(dòng)覆蓋父元素的overflow:hidden的屬性的話，你可以試試讓那個(gè)偽類相對(duì)于白色背景框的父元素絕對(duì)定位吧