美文网首页
原生滚动和固定元素坑点

原生滚动和固定元素坑点

作者: cutecat | 来源:发表于2019-04-06 22:10 被阅读0次

现象:-webkit-overflow-scrolling:touch与position:fixed一起使用,父元素设置了-webkit-overflow-scrolling:touch,子元素设置position:fixed,会出现滚动到页面的上下界限时,会有一个白色块遮住拥有position:fixed属性的元素

 (-webkit-overflow-scrolling:touch:指定是否在overflow:scroll的元素中使用“原生”的滚动方式。)

解决方案:将拥有position:fixed属性的元素和-webkit-overflow-scrolling:touch的元素放在同一个层级,转换为兄弟节点,而不是父子节点。

相关文章

  • 原生滚动和固定元素坑点

    现象:-webkit-overflow-scrolling:touch与position:fixed一起使用,父元...

  • js滚动相关

    js 原生滚动到指定元素(元素滚动到可视范围)

  • position:sticky

    粘性定位 粘性定位是相对定位和固定定位的混合。元素在跨越特定阈值前为相对定位,之后为固定定位。 当窗口滚动到元素 ...

  • 4.侧边栏固定

    HTML5开发项目实战:侧边栏固定 知识点: 1.事件处理(滚动事件) 2.获取滚动的高度 3.获取元素的高度 4...

  • iview 锚点爬坑 && vue 锚点

    在vue中实现锚点定位效果 iview的锚点 原生锚点实现 iview爬坑点 且需要把滚动容器的id或者class...

  • css3 position:fixed 固定居中的问题

    固定定位: 元素的位置相对于浏览器窗口是固定位置。即使窗口是滚动的它也不会移动 元素固定一般使用position:...

  • 2020-05-16 Flutter SliverPersist

    SliverPersistentHeader是在CustomScrollView中需要在滚动中固定在页面顶部的元素...

  • CSS0-1课程复习和总结

    1、页面的背景是固定的,不随页面的滚动而滚动 背景固定有两种实现方式,一种是元素 fixed,其背景不做特殊处理;...

  • [CSS] H5 横向滚动条隐藏

    H5为了让滚动和原生滚动一样丝滑则需要增加下面这个属性 但是增加该属性后滚动条无法隐藏 解决方式在此属性的元素上使...

  • 二十六,固定定位

    固定定位:现对于浏览器窗口进行定位 ( 固定元素不会随,页面翻滚而滚动 )代码-->position:fixed;

网友评论

      本文标题:原生滚动和固定元素坑点

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