首先描述一下功能 实现列表页动态加载 通过官方提供的"下拉刷新和上拉刷新"及"图片懒加载"示例实现. http://www.cnblogs.com/phillyx/ 然后说一下bug 首次加载时图片可以获取成功, 再次加载失败,通过chrome调试发现img 的 data-lazyload 属性没改变 调试的时候发现了bug $.fn.imageLazyload = function(options) { var lazyloadApis = []; this.ea

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no"> <meta name="apple-mobile-web-app

文章来源:小青年原创发布时间:2016-05-29关键词:mui,html5+,XMLHttpRequest,ajax,懒加载转载需标注本文原始地址: http://zhaomenghuan.github.io... 写在前面 这是这个系列的的第三篇文章,前面的文章在多个地方(本人github博客.dcloud ask社区.segmentfault)发出来了,很多朋友收藏点赞,只是没有多少人反映内容的深浅,也没有人提出意见,所以实话说不知道符不符合大家胃口,不过我写博客一向以详细为标准,尽可能照

为textarea添加语音输入和清除的功能 mui支持input输入框语音输入和清除的功能,只需要添加相关css类即可. http://www.cnblogs.com/phillyx/ 代码如下 <div class="mui-input-row"> <label>Input</label> <input type="text" class="mui-input-clear" placeholder=&q

平时项目中使用的全部是jQuery框架,但是对于做webapp来说jQuery太过于庞大,当然你可以选择jQuery 2.*针对移动端的版本. 这里我采用移动端使用率比较多的zepto框架,他跟jquery语法类似,相当于精简的jQuery把! 做webapp不得不考虑用户的网络情况跟用户体验度,所以传统的分页,在webapp上肯定是不行的,这里一般情况都是做成滚动自动更新,对于图片方面,当然是lazyload了,但是网上的lazyload Plugin是jQuery的,当然你可以改写成Zept

最近在开发APP的过程中,遇到一个问题,就是内容有一个固定的头部和底部.         头部就是我们常用的header了,底部的话,就放置一个button,用来提交页面数据或者进入下一个页面等,效果如下: 这里面需要注意到的地方就是,头和底是固定的,但是中间的部分呢,由于要设置24小时的内容,从图中可以看到,只显示了03:00~13:00的内容,剩下的内容没显示出来.这里面,我们就需要用到区域滚动了,就是保持头和底不动,中间滚动,所以,我们就要用到MUI的scorll组件,根据MUI官网的介绍

最近在用MUI开发这个APP,发现有时候这个plusready不起作用,表现在,这个页面如果重复打开,这个plusready就进不去,然后上一个页面传过来的值,就没法接收了.这个经过MUI官方确认,是有可能发生的,所以,这里面的话,就需要通过自定义事件,来确保这个值能正确传递.             首先,我先演示一下,通常我们页面之间的传值的方法,如下:             参数生成页面:                 mui.openWindow({                 

为 Windows Phone 8 App 添加本地化的时候,发现修改 AppResLib.dll.*.mui 后不仅没有其变化,还发现修改它导致它失效.通过对比代码发现,问题原因是 AppResLib.dll.*.mui 的生成操作由 Content 变成了 None. 改为 Content 后问题解决. :)

mui中 scroll和上拉加载/下拉刷新同时存在会出现两个滚动条 把/*   */ /* //mui页面鼠标拖动代码: mui('.mui-scroll-wrapper').scroll({ deceleration: 0.0005 //flick 减速系数,系数越大,滚动速度越慢,滚动距离越小,默认值0.0006}); */ 内代码去掉可以避免出现双滚动条,但是没有上拉加载/下拉刷新时,不能去掉(二者取一): (另外发现mui.scrollto(0,0,1000)和上拉加载/下拉刷新时同时存

在开发中监听双击屏幕事件时不起作用,需要在mui.init方法的gestureConfig参数中设置需要监听的手势事件 手势事件配置: 根据使用频率,mui默认会监听部分手势事件,如点击.滑动事件:为了开发出更高性能的moble App,mui支持用户根据实际业务需求,通过mui.init方法中的gestureConfig参数,配置具体需要监听的手势事件. mui.init({ gestureConfig:{ tap: true, //默认为true doubletap: true, //默认为

懒加载的意义(在线demo预览) 尽管很多公司的网页都有一些限制,比如页面的最大的图片大小不得大于50k,也有很多图片优化工具fis3.gulp等等,但是如果图片太多还是会影响页面的加载速度,快则几十秒慢则几十分钟,这样会导致用户流失. 图片的加载对页面的加载速度有很大影响!!所以,对于图片过多的页面,为了加速页面加载速度,所以很多时候我们需要将页面内未出现在可视区域内的图片先不做加载, 等到滚动到可视区域后再去加载.这样子对于页面加载性能上会有很大的提升,也提高了用户体验,即图片赖加载~ 原理

js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text/javascript" defer>,defer属性可以推迟对脚本的解释,直到文档已经显示给用户为止,但只有IE支持defer属性 (2)设置具体的延迟时间,对应的js代码如下: function loadScript(){ var myScript=document.createEleme

重复加载同一个jqgrid时需要先清除原先的数据,再进行加载新的数据: 清除时使用方法:jQuery.jgrid.gridUnload('jqGridId'); 同时还有一个GridDestroy的方法,该方法是直接将grid从dom上删除,无法重复加载.

mui 下拉刷新 此文提供的是mui这种下拉刷新.悬浮于页面上,比较好用. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Hello MUI</title> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-

mui-slider 问题:动态给mui的图片轮播添加图片,轮播不滚动. 解决:最后把滚动轮播图片的mui(".mui-slider").slider({interval: 3000});添加在ajax构建数据之后. 动态给mui的图片轮播添加图片,使用的ajax获取的数据,怎么弄轮播也不滚动,最后把滚动轮播图片的mui("#slider").slider({interval: 3000});添加在ajax的最后就可以了. 原因是你ajax 还没有执行完成,已经支持

ajax: mui.ajax('http://server-name/login.php',{ data:{ username:'username', password:'password' }, dataType:'json',//服务器返回json格式数据 type:'post',//HTTP请求类型 timeout:10000,//超时时间设置为10秒: success:function(data){ //服务器返回响应,根据响应结果,分析是否登录成功: ... }, error:func

<script type="text/javascript" src="jquery-1.11.3.min.js"></script><script type="text/javascript" src="jquery.lazyload.min.js"></script><script type="text/javascript">$(functi

Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的.在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某些情况下还可以帮助降低服务器负担. Demo页面: 基本选项 淡入效果 对不支持JavaScript浏览器的降级处理 水平滚动 容器内水平滚动 容器内垂直滚动 页

1.页面间传值 2.mui如何增加自定义icon图标 http://ask.dcloud.net.cn/article/128 3.设计基于HTML5的APP登录功能及安全调用接口的方式(原理篇) http://ask.dcloud.net.cn/article/157

最近在用mui写页面,当然了在移动App里引入jq或zepto这些框架,肯定是极不理性的.原生JS挺简单,为何需要jq?jq的成功当时是因为ie6.7.8.9.10.chrome.ff这些浏览器不兼容,让开发者崩溃,而且pc上浏览器性能好,跨平台兼容也不影响性能.但jq根本就不是为手机设计的.手机上只有webkit浏览器(忽略wp,反正mui不支持wp),根本就不需要jq这种封装框架来操作dom.选择元素//jq$('.el');//js   document.querySelector("di

在实际的项目开发中,我们通常会遇见这样的场景:一个页面有很多图片,而首屏出现的图片大概就一两张,那么我们还要一次性把所有图片都加载出来吗?显然这是愚蠢的,不仅影响页面渲染速度,还浪费带宽.这也就是们通常所说的首屏加载,技术上现实其中要用的技术就是图片懒加载--到可视区域再加载. 思路: 将页面里所有img属性src属性用data-xx代替,当页面滚动直至此图片出现在可视区域时,用js取到该图片的data-xx的值赋给src. 关于各种宽高: 页可见区域宽: document.body.clien