美文网首页
transform限制position:fixed的跟随效果

transform限制position:fixed的跟随效果

作者: KevinLee0424 | 来源:发表于2019-03-28 15:52 被阅读0次

    position:fixed是对于浏览器窗口定位的,而且这种效果连它的兄弟们position:relative/absolute都限制不了。但是,position:fixed固定效果却被父元素上的transform改变了属性,直接降级变成position:absolute的属性。

    例如下面示意代码:
    <div style="transform:scale(1.1)">
         <div style="width:100px;height:100px;background:red;position:fixed;"></div>
    </div>

    结果,本来应该不跟着滚动条滚动的傲娇fixed元素,变成absolute一样的行为表现,归根结底就是父元素加了transform属性值。

    相关文章

      网友评论

          本文标题:transform限制position:fixed的跟随效果

          本文链接:https://www.haomeiwen.com/subject/axgqbqtx.html