首页
学习
活动
专区
圈层
工具
发布
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    基于 Vue 的两层吸顶踩坑总结

    本文首发于政采云前端团队博客:基于 Vue 的两层吸顶踩坑总结 https://www.zoo.team/article/double-ceiling ?...前言 近日,在做活动页的过程中遇到两层吸顶的需求,并且要兼容 IE9 及以上的浏览器。乍一看不就是个吸顶嘛,应该不难吧,事实证明还是踩了很多坑才出来。兼容性问题多到吐血,我太难了。...废话不多说,先看一下两层吸顶的最终实现效果,如下图所示。 ?...图片.gif 功能点:两层吸顶,因为 Tabs 区域比较长所以在滚动过程中点击一层 Tabs 会回弹至一层吸顶刚吸顶的位置,这个功能点和锚点有些类似。...如果大家也遇到过两层吸顶的问题或者你还知道更好的解决方案,欢迎在评论区留下宝贵评论。

    91310

    基于 Vue 的两层吸顶踩坑总结

    前言 近日,在做活动页的过程中遇到两层吸顶的需求,并且要兼容 IE9 及以上的浏览器。乍一看不就是个吸顶嘛,应该不难吧,事实证明还是踩了很多坑才出来。兼容性问题多到吐血,我太难了。...废话不多说,先看一下两层吸顶的最终实现效果,如下图所示。 ?...图片.gif 功能点:两层吸顶,因为 Tabs 区域比较长所以在滚动过程中点击一层 Tabs 会回弹至一层吸顶刚吸顶的位置,这个功能点和锚点有些类似。...个值中的一个,否则只会处于相对定位 父元素的高度不能低于 sticky 元素的高度 sticky 元素仅在其父元素内生效 问题汇总 ◎ 吸顶“叠罗汉” 吸顶元素在滚动到组件底部时,在谷歌、火狐等浏览器中,两层吸顶在消失过程中有重叠现象...如果大家也遇到过两层吸顶的问题或者你还知道更好的解决方案,欢迎在评论区留下宝贵评论。

    1.7K20
    领券