Javascript 滚动浮动/滑动侧边栏问题

我已经看过这里所有与我面临的问题相关的东西，但仍然无法修复

我想做的是：

当用户上下滚动页面时，获得浮动的侧栏导航

使侧边栏集中停止，以便可以看到并单击所有元素

我得到的是：

当向下滚动（集中视图）时，侧边栏跟随滚动，但当向上滚动时，当页面向上滚动过快时，只显示侧边栏的一半

当向下滚动页面时，侧边栏会将页脚一直向下推

当页面从底部一直向上滚动时，侧边栏将不会锁定回其原始位置。似乎有一点差距

以下是剧本（改编自慷慨的乔登·米尔斯）：

函数animate_box（）{
var offset=-15；/*将其设置为css中的起始页边距顶部*/
var element=document.getElementById（'animate_box'）；
if（元素）{
var top=Number（字符串（element.style.marginTop）、子字符串（0，字符串（element.style.marginTop）、indexOf（'px'））；
试试{
如果（document.body.scrollTop>500）{
变量差=（document.body.scrollTop+偏移量）；
}如果（document.documentElement.scrollTop>0）{
变量差=（document.documentElement.scrollTop+偏移量）；
}否则{
var差=偏移量；
}  
}第（e）款{
var差=偏移量；
}  
差异=差异-顶部；
如果（差值>200）{
element.style.marginTop=（top+Math.abs（Math.ceil（差/30））+'px'；
}如果（差值<190）{
element.style.marginTop=（top-Math.abs（Math.ceil（差/30））+'px'；
}  
}  
}  
设置间隔（动画框，50）；

我建议采用不同的方法：

• 保存元素的起始位置（.offset（）.top）
• 发生滚动时：
• 如果窗口滚动偏移量（.scrollTop（））大于起始位置，则将侧边栏的位置更改为“固定”并带有“顶部：0”
• 如果在起始位置下，将其更改回静态（默认位置）

大概是这样的：

$(function() {
    var backup_position_toolbar = $('#sidebar').offset().top;
    $(window).scroll(function() {
        if ( $('#sidebar').offset().top - $(window).scrollTop() < 0) $('#sidebar').addClass('fixed');
        if ( $(window).scrollTop() < backup_position_toolbar ) $('#sidebar').removeClass('fixed');
    });
});

请注意，我使用的“固定”类定义如下： .固定{ 位置：固定； 排名：0； }

这使得菜单更可用。 如果你想在某一点阻止侧边栏，你可以添加更多的逻辑（即当底部太近时）。 这样，您就不需要设置数值（500、200等）

然而，如果你想不费吹灰之力就能得到更多的东西，试着用“粘贴”来引导（看看左边的菜单，这就是你想要的）

---

为什么要制作动画？为什么不能使用

位置：固定？您希望它如何浮动？哈哈，我也要这么说@PraveenKumar@Andy任何一个基本的web开发人员都会问这个问题，如果OP不打算为IE 6编写代码的话。True@PraveenKumar我问他希望它如何浮动的主要原因是，如果他使用Javascript，那么一定会有他想要的浮动效果，因为这应该很容易实现，否则。我道歉，愚蠢的我没有包括样本网站：谢谢！我要去试验一下：）
$(function() {
    var backup_position_toolbar = $('#sidebar').offset().top;
    $(window).scroll(function() {
        if ( $('#sidebar').offset().top - $(window).scrollTop() < 0) $('#sidebar').addClass('fixed');
        if ( $(window).scrollTop() < backup_position_toolbar ) $('#sidebar').removeClass('fixed');
    });
});