jquery touch 移动端上下滑动加载

var touchStart, touchEnd, touchDiff = 80;
        $(window).on({
            ‘touchstart‘: function (e) {
                touchStart = e.originalEvent.changedTouches[0].clientY;
            },
            ‘touchend‘: function (e) {
                touchEnd = e.originalEvent.changedTouches[0].clientY;
                var diff = touchStart - touchEnd;
                if (diff >= touchDiff) { // direction down
                    if ($(window).scrollTop() + $(window).height() >= $(document).height()) { // scroll bottom
                        buildList(pageIndex + 1);
                    }
                } else if (diff <= -touchDiff) { // direction up
                    if ($(window).scrollTop() == 0) { // scroll top
                        buildList(1);
                    }
                }
            }
        });
时间: 2024-08-05 06:16:39

jquery touch 移动端上下滑动加载的相关文章

基于JQuery实现滚动到页面底端时自动加载更多信息

基于JQuery实现滚动到页面底端时自动加载更多信息 关键代码: 代码如下: var stop=true; $(window).scroll(function(){ totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop()); if($(document).height() <= totalheight){ if(stop==true){ stop=false; $.post("ajax.

WP8_GestureListener实现列表向下滑动加载新数据

利用GestureListener的OnDragCompleted事件,实现列表向下滑动时,加载新的数据: (不建议使用 Touch.FrameReported+=Touch_FrameReported; 此事件是全局的,如果没有注销事件,在离开页面后仍会得到响应,而这不是希望的效果) 前台代码: <Border> <!- 此处放置ScrollViewer或 ListBox--> <ScrollViewer/>   <toolkit:GestureService.

客户端实现图片滑动加载,资讯详情页面

展示方案:客户端请求资讯详情数据接口获取 富文本数据 客户端使用WebView展示. 当文章详情篇幅长.包含图片多一次性加载全部图片会造成客户端短暂的卡顿 影响用户体验 所以考虑计划做图片滑动加载 默认使用统一的占位图. 本以为使用一个前端jquery插件(jquery.lazyload.js)就可以解决,应用这个插件后,出现问题所有图片还是一次性加载完成,不是滑动加载,分析发现是因为客户端在实现webview的时候要定义页面中的标题.评论.相关文章等不能够给设置webview的高度为固定手机屏

浏览器端的javascript加载器

commonJS,定义了一种同步加载脚本的规范.对于浏览器端而言,因为js脚本都是在远端,用同步的方式可能会长时间阻塞线程.因此,浏览器端的js加载器并不会严格按照commonJS来做.seajs作为一个试图遵循commonJS规范的加载器,是在规范的基础上在外面包一层define,来异步加载js,以下是seajs官网的一个例子: // 所有模块都通过 define 来定义 define(function(require, exports, module) { // 通过 require 引入依

SeaJS:一个适用于 Web 浏览器端的模块加载器

什么是SeaJS?SeaJS是一款适用于Web浏览器端的模块加载器,它同时又与Node兼容.在SeaJS的世界里,一个文件就是一个模块,所有模块都遵循CMD(Common Module Definition)规范.SeaJS本身遵循(Keep it Simple, Stupid)理念开发,API仅有几个. 为什么用SeaJS?假如我们要开发一个web应用App,在这个应用中需要使用jquery框架.App的首页index.html会用到module1.js,module1.js依赖module2

Android 为什么我的PullListView只能向下滑动,不能向上滑动加载更多???

============问题描述============ Android 为什么我的PullListView只能向下滑动,不能向上滑动加载更多??? ============解决方案1============ mode模式,你可以看看官方api

程矢Axure夜话:Axure手机原型视频教程之中继器上下滑动加载更多

案例描述:中继器上下滑动加载更多 知识点: 中继器复合使用 效果图: 在线效果预览:(firefox原型文件) AxShare在线效果预览: 原型下载地址:中继器上下滑动加载更多.rp 在线视频: 实现步骤: 更新中…..

Android-搭建简单服务端+ListView异步加载数据

Android-搭建简单服务端+ListView异步加载数据 2014年5月6日 本篇博文带给大家的是教大家如何在MyEclipse中搭建一个服务端,并通过手机端与其通信,异步加载数据. 笔者使用的是MyEclipse,各位也可以直接用Eclipse创建Java Web项目,谷歌提供的ADT Bundle是不能创建Web项目,读者可以下载Eclipse For JaveEE Developer这个IDE. 下面来介绍如何在MyEclipse创建一个Web项目,并部署到Tomcat当中,关于Tom

使用jquery的load方法设计动态加载,并解决浏览器前进、后退、刷新等问题

继上一篇 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题 解决了后台业务系统的部分动态加载问题,然而该框架离正常的用户体验还存在一些问题,如:浏览器的前进.后退.刷新等问题.有博友也遇到了同样的问题,接下来就针对浏览器的前进.后退.刷新进行用户体验优化. 在解决上述问题时也进行了各种search,但是大部分都是自己实现的插件,而且插件年久失修,对于新的jquery支持不佳.也有使用h5新加的history方法来实现的,由于HTML5的广泛使用,绝大部分主