js滑动到底部加载更多

<script type="text/javascript">

//滚动条到页面底部加载更多案例 
$(window).scroll(function(){
	
 var scrollTop = $(this).scrollTop();    //滚动条距离顶部的高度
 var scrollHeight = $(document).height();   //当前页面的总高度
 var clientHeight = $(this).height();    //当前可视的页面高度
 // console.log("top:"+scrollTop+",doc:"+scrollHeight+",client:"+clientHeight);
 if(scrollTop + clientHeight >= scrollHeight){   //距离顶部+当前高度 >=文档总高度 即代表滑动到底部 
     //滚动条到达底部
     alert(3)
 }else if(scrollTop<=0){
	//滚动条到达顶部
	 alert(4)
 //滚动条距离顶部的高度小于等于0 TODO

 }
});


 </script> 

如果设置了样式CSS，会使得滚动事件失效

html, body {
    height: 100%;  //若是需要Y轴滚动条，会事件失效应该注释
    width:100%     //若是需要X轴滚动条，会事件失效应该注释
}

对应设置，overflow:sroll出现滚动条

body {   
    line-height: 1;
	overflow:sroll;
	 font-size:62.5%;
	 font-family:"microsoft Yahei",Arial, Helvetica, sans-serif
}