hymn

忽有故人心头过,回首山河已是秋。

  menu
132 文章
0 浏览
3 当前访客
ღゝ◡╹)ノ❤️

css 中position:sticky 用法

需求:滚动页面,原本固定页面中的div,当div处于页面顶部时,固定在页面顶部。

解决:

// 原本是js脚本实现的,但是js时间会发现div不停闪烁,原因是当滚动页面时会不停的计算div距离顶部的距离。
$(document).scroll(function () {
    //固定SideBar
    if ($(document).scrollTop() > '50') {
        $('.middle-top').offset({ top: $(document).scrollTop() + 100 });
    } else if ($(document).scrollTop() <= '50') {
        $('.middle-top').offset({ top: 300 });
    };

});

// 改进  position 有个属性sticky
{
	position: sticky;
	top: 0;
}

标题:css 中position:sticky 用法
作者:hymn
地址:https://www.dxyhymn.com/articles/2020/05/29/1590739675951.html