用过jqmobi的人都会知道,其自带滚动性别实在不可恭维,iscroll是一款专门针对移动前端滚动,做了特别优化的超级工具,大家可能都会想把jqmobi自带的给替换掉,但兼容性真是如履薄冰,以下是实操干货
1、添加iscroll.js文件,iscroll-lite.js是简化版,不带滚动条的
2、添加一个面板panel,设置为no-scroll,设置data-load时创建iscroll对象
<div id="pn_test" class="panel no-scroll" title="iscroll4测试" data-load="loaded"
data-defer="iscroll4.html" data-footer="none">
</div>
3、创建iscroll js对象代码
var myScroll;
function loaded() {
myScroll = new iScroll('wrapper');//,{hScrollbar: false,vScrollbar:false}
}
4、iscroll4.html的代码,需要设置wrapper、scroller样式
<style type="text/css">
#wrapper {
position:absolute; z-index:1;
top:0px; bottom:0px; left:0;
width:100%;
/*background:#aaa;*/
overflow:auto;
}
#scroller {
position:absolute; z-index:1;
/* -webkit-touch-callout:none;*/
-webkit-tap-highlight-color:rgba(0,0,0,0);
width:100%;
padding:0;
}
/*#scroller ul {*/
/*list-style:none;*/
/*padding:0;*/
/*margin:0;*/
/*width:100%;*/
/*text-align:left;*/
/*}*/
/*#scroller li {*/
/*padding:0 10px;*/
/*height:40px;*/
/*line-height:40px;*/
/*border-bottom:1px solid #ccc;*/
/*border-top:1px solid #fff;*/
/*background-color:#fafafa;*/
/*font-size:14px;*/
/*}*/
</style>
<div id="wrapper" >
<div id="scroller" >
<ul class="list inset">
<li>Pretty row 1</li>
<li>Pretty row 2</li>
<li>Pretty row 3</li>
<li>Pretty row 4</li>
<li>Pretty row 5</li>
<li>Pretty row 6</li>
<li>Pretty row 7</li>
<li>Pretty row 8</li>
<li>Pretty row 9</li>
<li>Pretty row 10</li>
<li>Pretty row 11</li>
<li>Pretty row 12</li>
<li>Pretty row 13</li>
<li>Pretty row 14</li>
<li>Pretty row 15</li>
<li>Pretty row 16</li>
<li>Pretty row 17</li>
<li>Pretty row 18</li>
<li>Pretty row 19</li>
<li>Pretty row 20</li>
<li>Pretty row 21</li>
<li>Pretty row 22</li>
<li>Pretty row 23</li>
<li>Pretty row 24</li>
<li>Pretty row 25</li>
<li>Pretty row 26</li>
<li>Pretty row 27</li>
<li>Pretty row 28</li>
<li>Pretty row 29</li>
<li>Pretty row 30</li>
<li>Pretty row 31</li>
<li>Pretty row 32</li>
<li>Pretty row 33</li>
<li>Pretty row 34</li>
<li>Pretty row 35</li>
<li>Pretty row 36</li>
<li>Pretty row 37</li>
<li>Pretty row 38</li>
<li>Pretty row 39</li>
<li>Pretty row 40</li>
</ul>
</div>
</div>
5、$.ui.useTransition = false; //禁用动画可提高速度和三星手机的兼容性
- 浏览: 971863 次
- 性别:
- 来自: 山西
文章分类
最新评论
-
白小默:
你好 可以提供下源码DEMO吗,不知为何,我导出来的excel ...
jxls 使用模板文件导出生成excel -
zkzqzzz:
博主威武!
让微信二维码扫描您的APK -
zkzqzzz:
感谢博主 原来那些类都不是必须的 或者自己写!!博主真棒 ...
抢红包插件实现原理浅析 -
zkzqzzz:
博主 请问你的其他类在哪里呢?
抢红包插件实现原理浅析 -
zkzqzzz:
其他类在哪呢?
抢红包插件实现原理浅析
发表评论
-
IOS-HTML5-Video标签不能播放
2019-05-06 12:04 1602h5的video标签 在UIwebview ... -
Android客户端代码保护技术-完整性校验
2018-01-08 17:10 1317由于Android系统固有的缺陷、Android应用分发 ... -
android开发中手动v2签名实现方法
2018-01-08 10:31 1117用v2签名前要进行v1签名或zipalign。 1. z ... -
webview支持LocalStorage本地存储
2017-03-31 10:30 1394//允许JavaScript执行 ... -
七步配置phonegap+cordova+ionic开发环境
2016-12-19 16:21 726本文讲的是Android混合 ... -
iOS企业应用发布教程
2016-11-01 08:51 423iOS企业应用可以不经过app store发布,而可以直接在 ... -
IOS在自己网站发布APP(企业版$299上线流程)
2016-11-01 08:49 486最近刚上线一个企业内 ... -
梆梆加固破解
2016-10-13 09:01 1572本文假设你已经使用过梆梆加固,手头至少有个一个通过梆梆加固后 ... -
android zxing 扫描二维码 横屏转竖屏
2016-09-14 15:41 0Zxing 竖屏切换 Android 在google上下 ... -
封装Volley使Volley的每个请求都自动保存和发送Cookie
2016-09-14 10:57 0思路很简单,每次请求获取到服务器返回的response就解 ... -
Android二维码ZXing扫描区域大小的调整,提高扫描速度
2016-09-14 10:48 2681Zxing本身默认的扫图区域最大只有 360*480 ... -
解决Android二维码扫描ZXing竖屏拉伸变长闪退扫描区域小等问题
2016-09-14 10:42 1296Android 基于google Zxing实现二维码、条形 ... -
Android平台下利用zxing实现二维码开发
2016-09-14 09:25 519现在走在大街小巷都能看到二维码,而且最近由于项目需要,所以研 ... -
Zxing扫描二维码
2016-09-14 09:24 695摘要 android Zxing扫描二维码 横竖屏 ... -
Android 基于google Zxing实现二维码、条形码扫描,仿微信二维码扫描效果
2016-09-14 09:18 546转载请注明出处:http://blog.csdn.net/x ... -
xcode Run Script Command /bin/sh failed with exit code 1
2016-09-09 17:38 1294Xcode编译库报错:Command /bin/sh fai ... -
(二十三):Objective-C代码混淆扩展----安全攻防之代码混淆的一个小工具iOS安全攻防
2016-09-09 15:10 1220http://blog.csdn.net/yiyaaixu ... -
iOS安全–浅谈关于iOS加固的几种方法,代码混淆,类名方法名混淆等
2016-09-09 15:00 821转自:http://www.blogfshare ... -
Request获取用户真实IP
2016-09-05 11:26 600在Servlet里,获取客户端的IP地址的方法是:reque ... -
IOS UIAlertView(警告框)方法总结
2016-09-02 16:17 412摘要 在IOS8之后,UIAle ...
相关推荐
JQMobi 和 App Framework 是移动应用开发中的两个关键框架,它们在构建跨平台的移动Web应用和本地应用中发挥着重要作用。JQMobi 是一个轻量级的JavaScript库,而App Framework则是基于JQMobi的一个扩展,提供了更...
在移动应用开发领域,AppFramework和JqMobi是两个备受开发者喜爱的轻量级框架。它们为开发者提供了便捷的工具,使得创建功能丰富的、跨平台的移动应用变得更加简单。本篇文章将深入探讨这两个框架的特性以及如何结合...
intel appframework3.0测试版 jqmobi3.0测试版 App Framework 3.0和前面的版本比较有很大的变动。当本项目于2011开启之后,一直聚焦于修正系统的bug(比如安卓平台上的 CSS3 变换)、提供一个可靠的 scrolling ...
jqMobi是由appMobi针对HTML5浏览器和移动设备开发的javascript框架,是个极快速的查询选择库,支持W3C查询。 版本 jqMobi源码最初在2012年1月份推出,基于MIT/X11许可证,托管在GitHub上,开发者可参与并通过插件...
AppFramework,又称为 jqMobi,是一个轻量级的JavaScript框架,专为移动应用开发设计。它集成了jQuery的最佳实践,提供了丰富的UI组件和强大的功能,使得开发者能够快速构建高性能、跨平台的移动应用。本开发文档将...
** jqMobi 移动开发框架详解 ** ...总之,jqMobi 和 App Framework 为移动开发提供了一套全面的解决方案,无论是对于新手还是经验丰富的开发者,都是构建高效、稳定、用户体验良好的移动应用的理想选择。
AppFramework 3.0 Beta 还增强了对各种移动设备和浏览器的兼容性。支持包括iOS、Android、Windows Phone在内的主流操作系统,以及Chrome、Safari、Firefox等浏览器,确保应用能在广泛的设备环境中稳定运行。同时,新...
jq.appframework.js 使用jquery 和afui 开发,而不必局限于appframework.js 可以参考我的博客:http://blog.csdn.net/vincentblog/article/details/38041609
今天 Intel 发布了其对 jQMobi 框架的改造版本 "Intel App Framework". 这个新的 HTML5 开发环境可完全免费下载,侧重于构建见人 iOS、Android 和 Windows Phone 8 甚至是 Kindle、Nook、Facebook 和 Windows 8 的...
appframework3.0 jqmobi3.0.0测试版,好多bug已被修复,赶紧下砸使用吧! ps: 交流企鹅群:333492644
通过`jqMobi`,开发者可以轻松地选择和操作DOM元素,实现高效的数据绑定和事件处理。 - **`jqPlugins`**:这是一系列专门针对移动应用的插件集合,适用于Webkit浏览器环境下的AppMobi和其他通用移动Web开发项目。`...
在2013年2月22日,英特尔公司收购了HTML5移动应用公司appMobi,随后JqMobi更名为appframework,这表明了英特尔致力于打造自家的移动应用开发者工具套件,并可能会考虑为HTML5和CSS3提供更强大的硬件支持。...
开发者可以通过这些资源学习如何使用jqMobi,解决可能出现的问题,并了解新版本的改进和修复。 jqMobi 1.02rc1的发布,对于那些希望以高效、跨平台的方式开发HTML5移动应用的开发者来说,是一个重要的里程碑。通过...
jqMobi 是一个轻量级的JavaScript移动框架,专为手机和触摸设备设计,旨在提供高效、简洁的移动应用开发解决方案。它包括了一系列的功能,如事件处理、动画效果、Ajax加载以及触摸优化等。在jqMobi中,图标是UI设计...
它不仅在原生移动设备上表现出色,而且还能很好地兼容各种移动Web框架,如jqMobi。这款控件提供了丰富的自定义选项,使得开发者能够轻松地在移动应用中集成高质量的时间和日期输入组件。 Mobiscroll 2.10.0 版本是...
文件`jqMobi.manual.doc`很可能是jqMobi的官方手册或用户指南,包含了详细的API文档和使用示例,对于深入理解和使用jqMobi是非常宝贵的资源。建议仔细阅读此文档,以便更好地掌握jqMobi的各种功能和用法。 总的来说...
学习如何使用浏览器的开发者工具进行问题排查,以及如何编写自动化测试脚本,对于提升开发效率和产品质量都非常重要。 8. **兼容性与适配** 移动设备种类繁多,屏幕尺寸和操作系统各异。源码中可能包含了针对不同...
本文将深入探讨如何利用jqMobi、PhoneGap以及相关的JavaScript技术来实现手机触屏滑动效果,并动态设置手机屏幕的高度和宽度,以优化移动应用的性能和交互性。 一、jqMobi简介 jqMobi是一个轻量级的JavaScript库,...
"appframework-master"这个文件名可能是jqMobile 3.0的源码仓库,包含了构建和扩展jqMobile应用所需的所有资源,如JavaScript文件、CSS样式、示例代码和文档。开发者可以通过研究这些源码,深入了解其内部工作原理,...
本项目是基于Jqmobi实现的百度地图功能,特别是实现了三维地图的展示,这对于地理信息展示和定位服务来说具有很高的实用价值。 首先,我们要了解Jqmobi框架的核心特点。Jqmobi 是一套轻量级的JavaScript库,它借鉴...