前端开发中，对于滚动条位置的识别

最近在上班空闲之余制作新的小说模板，这半个多月来学了很多东西，感觉能很快派上用场。因为突发奇想，我想实现导航栏的特效，无非就是当屏幕滚动到一定位置的时候，导航栏脱离出来，改变样式并且悬浮在顶部，很多网站也是使用了这种方法，最终的效果还是相当不错的，导航不需要总是保持置顶，也不需要访问者手动再回到顶部。以后可能会经常用，所以决定记录下来。

代码如下，需要引入jQuery：

$(document).ready(function(){
    window.onscroll=function(){
            if($(document).scrollTop()>140){
                $(".nav_center").css({"position":"fixed","z-index":"999","top":"0","left":"0","width":"100%","background":"#007cb2"});
            };
            if($(document).scrollTop()<180){
                $(".nav_center").css({"position":"static","width":"1210px","margin":"0 auto","background":"none"});
            }
    }
});

我要实现的效果就是，当滚动到一定位置的时候，网页的导航变为置顶且不随滚动条改变位置，当滚动条回归的时候，又恢复成原来的状态、scrollTop()就是用于对位置的识别，这样就可以通过css()方法改变区块样式。