h5页面上下滑动,html5上下滑动
如何判断滚动是否滚动到了底部？
首先要知道的是scrollheight，clientheight，scrolltop
scrollHeight
只读属性。高度包括所有内容，包括内边距，但不包括水平滚动条、边框和外边距。
clientHeight
它也是一个只读属性。没有定义CSS或内联布局框的元素为0，是元素内部的高度，包括内边距，不包括X轴的滚动条高度、边框和外边距；
同样型号的手机也是一样的。
scrollTop
此元素的顶部滚动距离(到视区顶部的距离(通常是html))。
你可以计算到底部的距离。
计算是否到达底层原生js。
element . scroll height-element . scroll top===element . client height
框架
元素.scroll height-element . scroll top()==element . height()
实现下拉刷新
使用Html jq
var loadingState={ text:false，image:false，video:false } var httpur L2= https://API。API打开。 top/get joke var options 1={ page:1，count:10，type: text } var options 2={ page:1，count:10，type: image } var options 3={ page:1，count:10，type:video } //在窗户里获取不到选项，就只能把选择放在数据对象里，就能用数据[选项（索引1)]获取到了var数据={选项1,选项2,选项3 }//请求语句所在loading state . text=true text render(选项1);//监听要滑动容器的滚动事件$(.内容)。scroll(function(e){ var index=$(this).index()；//获取滚动的距离var sTop=$( .内容)。情商(指数)。滚动顶部()；//获取容器的高度var contentHeight=$( .内容)。情商(指数)。height()；//获取滚动高度var scrollHeight=$( .内容)。eq(index)[0].scrollHeight//根据所选的不同选择加载不同的内容if(index==$(this).index()loadingState.text！=true) { //判断是否已经滚动底if((停止内容高度)==滚动高度){//当到达底部是加载选项为没错，之后的操作loadingState.text=true//内容缓慢淡出$(这个)。animate({ scrollTop:sTop 80 }，1000)var options=data[ options (index 1)]；//页数加一选项。page=1；//加载新获取的内容文本渲染(选项);} } }//加载实现函数函数文本呈现(obj){//要添加的内容if(obj==options 1){ console。log(obj)；$.get(httpUrl2，obj).然后(function(RES){ RES . result。foreach(function(item，I){ var html= div class= mui-card div class= mui-card-header mui-card-media img src= $ { item。header } div class= mui-media-body $ { item。name } p发表于$ { item。passtime }/p/div/div div class= mui-card-content div class= mui-card-content-inner p $ { item。text }/p/div/div div class= mui-card-footer a class= mui-card-link 喜欢/a a class=mui-card-link 评论/a /div /div ` $( .内容：等式(0))。追加(html).css(backgroundImage ， none )加载状态。text=false$(正在加载。正文’).停止（真)。slideUp(2000，function(){ $(加载。正文’).remove() }) }) }) }}以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。