PhoneGap中文网

 找回密码
 立即注册
查看: 17658|回复: 6

Jquery Mobile 滚屏事件(scrollstart、scrollstop)

[复制链接]

493

主题

2035

帖子

6894

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6894
发表于 2013-8-8 19:32:52 | 显示全部楼层 |阅读模式
    scrollstart:当屏幕滚动开始的时候触发。苹果的设备会在滚屏时冻结DOM的操作,当滚屏结束时按队列执行这些dom操作,我们现在正在研究方法让苹果的设备在滚屏开始前执行dom操作。
  1.     $(document).ready(function(){
  2.       $('body').bind('scrollstart', function(event) {
  3.         // Add scroll start code here
  4.       });
  5.     });
复制代码
scrollstop:滚屏结束时触发。
  1.     $(document).ready(function(){
  2.       $('body').bind('scrollstop', function(event) {
  3.         // Add scroll stop code here
  4.       });
  5.     });
复制代码
  1. <!DOCTYPE html>
  2.     <html>
  3.         <head>
  4.             <title>Ajax测试</title>
  5.             <meta charset="gbk">
  6.             <meta name="viewport" content="width=device-width, initial-scale=1">
  7.             <link rel="stylesheet" href="jquery-mobile/jquery.mobile-1.2.0.min.css"/>
  8.             <link rel="stylesheet" href="jquery-mobile/jquery.mobile.structure-1.2.0.min.css"/>
  9.             <script src="jquery-mobile/jquery-1.8.2.min.js"></script>
  10.             <script src="jquery-mobile/jquery.mobile-1.2.0.min.js"></script>
  11.         </head>
  12.         <body>
  13.             <div data-role="page" data-theme="b">
  14.             <div data-role="header"></div>
  15.             <div data-role="content">
  16.                 <script>
  17.                     //scrollstart事件
  18.                     function scrollstartFunc(evt) {
  19.                         try
  20.                         {
  21.                             var target = $(evt.target);
  22.                             while (target.attr("id") == undefined) {
  23.                                 target = target.parent();
  24.                             }
  25.                             //获取触点目标id属性值
  26.                             var targetId = target.attr("id");
  27.                             alert("targetId: " + targetId);
  28.                         }
  29.                         catch (e) {
  30.                             alert('myscrollfunc:' + e.message);
  31.                         }
  32.                     }
  33.                     function myinit() {
  34.                         //绑定上下滑动事件
  35.                         $("#myul").bind('scrollstart', function () { scrollstartFunc(event); });
  36.                     }
  37.                     window.onload = myinit;
  38.                 </script>
  39.                 <!-- listview测试 -->
  40.                 <ul id="myul" data-role="listview" data-inset="true">
  41.                     <li data-role="list-divider">信息列表</li>
  42.                     <li id="li1" data-role="fieldcontain">信息1</li>
  43.                     <li id="li2" data-role="fieldcontain">信息2</li>
  44.                     <li id="li3" data-role="fieldcontain">信息3</li>
  45.                     <li id="li4" data-role="fieldcontain">信息4</li>
  46.                     <li id="li5" data-role="fieldcontain">信息5</li>
  47.                     <li id="li6" data-role="fieldcontain">信息6</li>
  48.                     <li id="li7" data-role="fieldcontain">信息7</li>
  49.                     <li id="li8" data-role="fieldcontain">信息8</li>
  50.                     <li id="li9" data-role="fieldcontain">信息9</li>
  51.                     <li id="li10" data-role="fieldcontain">信息10</li>
  52.                 </ul>
  53.             </div>
  54.         </body>
  55.     </html>
复制代码
it营
回复

使用道具 举报

0

主题

108

帖子

116

积分

注册会员

Rank: 2

积分
116
发表于 2013-9-28 04:36:18 | 显示全部楼层
有竞争才有进步嘛
it营
回复 支持 反对

使用道具 举报

23

主题

141

帖子

260

积分

中级会员

Rank: 3Rank: 3

积分
260
发表于 2013-10-1 20:29:26 | 显示全部楼层
没看完~~~~~~ 先顶,好同志
回复 支持 反对

使用道具 举报

493

主题

2035

帖子

6894

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6894
 楼主| 发表于 2013-10-4 08:14:15 | 显示全部楼层
正在学习中 谢谢楼主了 非常支持 开源
回复 支持 反对

使用道具 举报

23

主题

141

帖子

260

积分

中级会员

Rank: 3Rank: 3

积分
260
发表于 2013-10-5 22:28:17 | 显示全部楼层
真是 收益 匪浅
回复 支持 反对

使用道具 举报

6

主题

176

帖子

198

积分

注册会员

Rank: 2

积分
198
发表于 2013-10-7 13:02:40 | 显示全部楼层
过来看看的
回复 支持 反对

使用道具 举报

493

主题

2035

帖子

6894

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6894
 楼主| 发表于 2013-10-9 05:01:03 | 显示全部楼层
正在学习中 谢谢楼主了 非常支持 开源
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐 上一条 /1 下一条

ionic4视频教程

Archiver|手机版|小黑屋| PhoneGap中文网 ( 京ICP备13027796号-1 )  

GMT+8, 2024-3-29 05:00 , Processed in 0.045187 second(s), 32 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表