jquery - 当点击浏览器顶部时,使用 jquery 滚动固定元素

标签 jquery css scroll position

我的脚本有点不稳定。假设有一个元素距浏览器顶部 25px,当我继续向下滚动时。在我的浏览器顶部接触之前,该元素不会转动 position:fixed; 。那么当我向下滚动时,该元素将跟随。然而,当我滚动回顶部时,该抖动来自于该元素将跟随到页面顶部,然后它将自身重置回其原始位置(距离顶部 25px)。

有没有办法消除抖动?

谢谢!

这是我的 jquery 脚本:

$(function() {
var a = function() {
    var b = $(window).scrollTop();
    var d = $("#notification-anchor").offset({scroll:false}).top;
    var c = $("#notification");
    if (b > d) {
        c.css({position:"fixed",top:"0px"})
    } else {
            if(b<=d){
        c.css({position:"relative"})
            }
    }
};
$(window).scroll(a);a()

});

最佳答案

尝试使用以下代码。 .toolsbar 将像 GMail 工具栏一样粘在页面顶部。这是你想要的吗?

$(function() {
    var $sidebar = $('.toolsbar');
    $window = $(window);
    offset = $sidebar.offset();
    topPadding = 0;

    $window.scroll(function() {
        if ($window.scrollTop() > offset.top) {
            $sidebar.css({
                'top': '0',
                'position': 'fixed'
            });
        } else {
            $sidebar.css({
                'top': '',
                'position': ''
            });
        }
    });            
});

关于jquery - 当点击浏览器顶部时,使用 jquery 滚动固定元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7749050/

相关文章:

javascript - Bootstrap 'collapsed' 类未出现在 DOM 加载中

javascript - 将脚本插入现有函数?

javascript - 使用 iScroll 始终显示滚动条

python - PyGTK 2 : TreeView is extending out of my window even with scroll bar enabled

javascript - 如何在 React JS 中使用 Scroll 魔法

javascript - CSS:通过鼠标拖动实现双向无限滚动

javascript - 为什么 .val() 会导致错误?

html - 背景图像未正确对齐

html - CSS:如何更改 webkit 中滚动条右下角的颜色?

html - CSS。移动设备上的中心 block