模拟移动端上拉超过页面实际高度

移动端有时经常会发现有些滚动条拉到底后,还能再拉一段,然后能自动弹回,我这里不讨论自动弹回,但是能够模拟上拉后再拉一段。

案例是上拉跳转的升级(http://www.cnblogs.com/jiangbanji/p/6025808.html)

在html里面最下端加一句这个:

<div class="box"></div>

样式如下:

.box{
	 100%;
	height: 0;
	background: #f5f5f5;
}

实现代码如下:

window.onscroll = function() {
	if(getScrollTop() + getClientHeight() == getTotalHeight()) {
		window.scrollBy(0,30);            //关键代码
		$(".box").animate({"height":"30px"},1200);  //次关键代码
		setTimeout(function(){
			window.location.href = "imgdetails.html";
		},1200);
	}
}

效果就是你在上拉到底时还能再拉一下下,而不是死的,然后就跳转了,就达到效果了。

至于自动弹回,我并没有试,看到这里,懂了的人应该也能做出来。

由于只是模拟,效果可能没有那些开源插件的效果好,但是也有效果,几行代码不必引入别人的文件了。

原文地址:https://www.cnblogs.com/jiangbanji/p/6026755.html