div滚动至顶部之后固定的方法

个人博客文章链接：http://www.huqj.top/article?id=146

在浏览网页的时候，经常会看到这种效果：导航栏向上滚动到浏览器顶部之后就固定在顶部不再往上，而向下滚动回来的时候又跟着原来的布局下去（可以参考本博客的导航栏效果）。

效果图片如下：

滚动到顶端之后：

 

实现的方式可以是通过jquery注册滚动事件，在事件中判断导航栏到顶部的距离，如果小于等于0则将导航栏的css样式中的position设置为fixed，并且改变一下颜色等样式（可选）。如果大于0则回复原来的样式。

具体代码见下面：

1 2 3 4 5 6 7 8 9 10 11 12 13