jquery操作与滚动条相关操作

1.返回顶部按钮实现
用到两个函数，和一个属性，scroll（）函数检测滚动条事件，通过scrollTop()得到滚动条离页面顶部的距离，文档内高度而不是，滚动条上的高度，点击按钮设置文档scrollTop的值为0,即可返回顶部。赋值下边代码，替换.top为按钮类即可。

$(function(){$(window).scroll(function(){    var t=$(this).scrollTop();    if(t>200){        $(".top").stop().fadeIn();     }else{        $(".top").stop().fadeOut();        }   });$(".top").click(function(){        $("body,html").stop().animate({scrollTop:0},300)});});

2.判断滚动条方向

$(function(){    var topinit = $(window).scrollTop();    $(window).scroll(function(){        var top = $(this).scrollTop();        if(top > topinit)        {            console.log("向下滚动");        }        else{            console.log("向上滚动");        }        topinit = top;    });});

3.根据滚动条的位置加载对应动画或内容，逐次加载。

$(function(){    var e_h = $(element).offset().top;//获得某个页面元素距离顶部的高度    var h = 200;//定义一个数值，当滚动条距离页面顶部200时触发一个函数。    $(window).scroll(function(){        var top = $(window).scrollTop();//获得滚动条距离顶部的距离        if(top > e_h-200)        {            //todo ....        }    });});

4.自定义滚动条
使用jquery mCustomScrollbar插件，下次再说。