jQuery判断滚动条是上滚还是下滚,且是否到达底部或顶部

jQuery判断滚动条是上滚还是下滚,且是否到达底部或顶部:http://www.haorooms.com/post/jquery_scroll_upanddown

 //滚动条滚动加载更多内容
//判断滚动方向
function scroll(fn) {
var beforeScrollTop = document.body.scrollTop || document.documentElement.scrollTop,
fn = fn || function() {};
window.addEventListener("scroll", function() {
var afterScrollTop = document.body.scrollTop || document.documentElement.scrollTop,
delta = afterScrollTop - beforeScrollTop;
if(delta == ) return false;
fn(delta > ? "down" : "up");
beforeScrollTop = afterScrollTop;
}, false);
}
//调用滚动方向:到达底部并且向下滚动的时候,加载更多评论
scroll(function(direction) {
if(direction=="down"){
console.log(direction); var scrollTop = $(window).scrollTop();
var scrollHeight = $(document).height();
var windowHeight = $(window).height();
//滚动到达底部
if (scrollTop + windowHeight == scrollHeight) {
$(".commListUl").append('<li class="commListLi"><figure class="left"><img src="http://staticcdn.dev.pydp888.com/cms/news/v1/img/listImg1.png"></figure><!-- 内容 --><div class="left commListCon"><p><span>韩旭明</span>&nbsp;&nbsp;<span>1小时前</span></p><p>承担包机任务的是高丽航空商社,也是朝鲜唯一的航空公司,由于大家周知的原因,朝鲜无法获得西方国家的先进客机,高丽航空的飞机全部为前苏联机型,不少都超过了正常服役年限。执飞此次航线的安-148,为中短途支线客机,由乌克兰安托若夫设计局设计,算是朝鲜目前比较新的机型,因朝鲜*金正恩经常搭乘该型飞机出行,也被称为"金正恩专机"。</p></div><div style="clear:both;"></div> </li>');
}
}
});

——————————————————————————————————————————————————————————

//判断鼠标滑轮方向
var scrollFunc = function (e) {
var direct = ;
e = e || window.event;
if (e.wheelDelta) { //判断浏览器IE,谷歌滑轮事件
if (e.wheelDelta > ) { //当滑轮向上滚动时
//alert("滑轮向上滚动");
var scrollTop = $(window).scrollTop();
var scrollHeight = $(document).height();
var windowHeight = $(window).height();
//滚动到达底部
if (scrollTop + windowHeight == scrollHeight) {
$(".commListUl").append('<li class="commListLi"><figure class="left"><img src="http://staticcdn.dev.pydp888.com/cms/news/v1/img/listImg1.png"></figure><!-- 内容 --><div class="left commListCon"><p><span>韩旭明</span>&nbsp;&nbsp;<span>1小时前</span></p><p>承担包机任务的是高丽航空商社,也是朝鲜唯一的航空公司,由于大家周知的原因,朝鲜无法获得西方国家的先进客机,高丽航空的飞机全部为前苏联机型,不少都超过了正常服役年限。执飞此次航线的安-148,为中短途支线客机,由乌克兰安托若夫设计局设计,算是朝鲜目前比较新的机型,因朝鲜*金正恩经常搭乘该型飞机出行,也被称为"金正恩专机"。</p></div><div style="clear:both;"></div> </li>');
}
}
if (e.wheelDelta < ) { //当滑轮向下滚动时
//alert("滑轮向下滚动");
}
} else if (e.detail) { //Firefox滑轮事件
if (e.detail> ) { //当滑轮向上滚动时
//alert("滑轮向上滚动");
var scrollTop = $(window).scrollTop();
var scrollHeight = $(document).height();
var windowHeight = $(window).height();
//滚动到达底部
if (scrollTop + windowHeight == scrollHeight) {
$(".commListUl").append('<li class="commListLi"><figure class="left"><img src="http://staticcdn.dev.pydp888.com/cms/news/v1/img/listImg1.png"></figure><!-- 内容 --><div class="left commListCon"><p><span>韩旭明</span>&nbsp;&nbsp;<span>1小时前</span></p><p>承担包机任务的是高丽航空商社,也是朝鲜唯一的航空公司,由于大家周知的原因,朝鲜无法获得西方国家的先进客机,高丽航空的飞机全部为前苏联机型,不少都超过了正常服役年限。执飞此次航线的安-148,为中短途支线客机,由乌克兰安托若夫设计局设计,算是朝鲜目前比较新的机型,因朝鲜*金正恩经常搭乘该型飞机出行,也被称为"金正恩专机"。</p></div><div style="clear:both;"></div> </li>');
}
}
if (e.detail< ) { //当滑轮向下滚动时
//alert("滑轮向下滚动");
}
}
ScrollText(direct);
}
//给页面绑定滑轮滚动事件
if (document.addEventListener) {
document.addEventListener('DOMMouseScroll', scrollFunc, false);
}
//滚动滑轮触发scrollFunc方法
window.onmousewheel = document.onmousewheel = scrollFunc;
上一篇:Mybatis第一天


下一篇:基于Geoserver发布时间地图