移动端开发：使用jQuery Mobile还是Zepto

原:http://blog.csdn.net/liubinwyzbt/article/details/51446771 jQuery Mobile和Zepto是移动端的js库.jQuery Mobile相当于PC端的jQuery UI,它提供了很多页面的UI库,能够很快的开发出漂亮的界面,适合公司没有UI设计师的前端开发人员来进行移动端的开发.Zepto相当于PC端的jQuery,它提供了很多方法和功能,能够很快的实现各种需求和功能,适合公司有UI设计师的前端开发人员来进行移动端的开发. jQu…

史上最简单的个人移动APP开发入门--jQuery Mobile版跨平台APP开发

书是人类进步的阶梯. ——高尔基习大大要求新新人类要有中国梦,鼓励大学生们一毕业就创业.那最好的创业途径是什么呢?就是APP.<构建跨平台APP-jQuery Mobile移动应用实战>就是一本写给没钱没身份没资历的创业小白看的APP书,看完这本书你可以拥有自己的一个APP,不用花钱就能移植到其他移动平台,支持iOS,Android,Windows Phone!!!!!!!!找个最便宜的来练手吧! 小白APP交流Q群: 348632872 清华大学出版社推出的<构建跨平台APP:j…

wap开发使用jquery mobile之后页面不加载外部css样式文件/js文件

场景: wap开发,使用jquery mobile之后不会加载外部自定义的css文件了,需要手动刷新才会加载,查看外部自定义的js文件也是一样. 解决办法: 1.在page下面添加css样式,就不要写在外部文件了,如: <body> <div data-role="page" id="pageone"> <style type="text/css"> ... </style> 2.据说还有一种方法(…

【初探移动前端开发】jQuery Mobile 二

本文例子请使用手机查看 List列表在移动设备平台下,由于移动设备屏幕比较小,我们又是用手在上面点击的触屏方式,传统的列表模式在手机上就不太友好了. 虽然HTML5与CSS3提供了强大的界面实现方案,jquery mobile作为jquery框架的一个移动web插件,他根据移动屏幕大小优化了UI组件, 列表组件就是jquery mobile根据移动设备的特性而实现的组件库之一. 我们来一个个看看我们的列表吧普通链接列表 <!DOCTYPE html> <html xmlns=&quo…

手机开发类型jquery的框架Zepto（API）

Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与jquery有着类似的api. 如果你会用jquery,那么你也会用zepto. http://www.html-5.cn/Manual/Zepto/ Echo.js – 简单易用的 JavaScript 图片延迟加载插件 http://www.cnblogs.com/lhb25/p/echo-js-image-lazy-loading-plugin.html jquery.template.js与Zepto结合 var…

Jquery Mobile转场特效之slide | 小小iPhone开发

Jquery Mobile转场特效之slide | 小小iPhone开发 2012 Jquery Mobile转场特效之slide 作者:小小发布:2012-12-12 14:03 分类:jQueryMobile 阅读:1,354 次暂无评论 Jquery Mobile页面转场有诸多特效,其中slide是滑动效果,确切说是从右向左滑动,在项目中使用时,如果有从右向左滑动,那么再加上"返回"的从左向右的滑动就有更好的体验了,由于jquery mobile没有特…

Jquery Mobile 小结

第一次做一个移动站点,当时纠结选Jquery Mobile还是Zepto,Zepto相对于JM更加轻巧,语法上面也很相似,但考虑到时间问题和JM自带了很多组件(Bootstrap惯出来的),还是选择了JM.JM主要通过data-role来定义页面控件,比如定义一个page,<div data-role="page"></div> 以及data-xx属性来对控件进行修饰.比如定义一个mini的button:<a data-role='button' data…

移动端开发demo—移动端web相册（一）

本文主要是介绍开发移动端web相册这样一案例用到的前置知识. 一.移动端样式移动端更接近手机原生的方式. 如下是一个angular mobile的demo的例子: 移动端demo做成这样的好处: 在手机端浏览器中打开,接近原生app应用. 打包成Android或者ios的app,以原生app呈现二.移动端web开发调试工具因为移动端主要的浏览器内核是webkit,所以可以用chrome开发.可以模拟UA和分辨率. 模拟触摸行为,注意touch和click区别. 也可以开启其他模拟. 三.移…

一个简单的特效引发的大战之移动开发中我为什么放弃jquery mobile

我本想安静的做一个美男子,可是,老板不涨工资,反而,一月不如一月. 我为什么放弃jquery mobile插件选择自己写特效? 在开发中大家都知道效率很重要,一个好的工具可以在开发中大大提升效率,工作做的越多,相应的取得的报酬也就越多,相反就是我自己了. 最近一直在一件事情上,移动线上网站测试必须符合3星,将不合格的网站调优后保证3星,方便线上推广,难免会遇见一些问题,大致为题后期会写一篇随笔总结,“移动开发中网站如何优化”.其中遇见的一个问题就是JS文件过大,CSS文件过大,之前项目一直使用的…

【初探移动前端开发05】jQuery Mobile (整合版)

前言为了方便大家看的方便,我这里将这几天的东西整合一下发出. 里面的例子请使用手机浏览器查看. 什么是jQuery Mobile? jquery mobile是jquery在移动设备上的版本,他是基于jquery.HTML5.CSS3构建的,他提供了一个丰富的交互性强的接口用以兼容不同移动平台. 于是我们去下载一番: 我这里就直接下载的这个压缩文件了,完了我们看看他有些什么东西,我们这个还是要依赖jquery的,所以还是准备一个吧. 这个东东是个好东西哦,他还有配套的样式呢,依赖他我们可以开发…

【初探移动前端开发04】jQuery Mobile (中)

前言昨天我们一起学习了一部分jquery mobile的知识,今天我们继续. 这些是些很基础的东西,有朋友觉得这个没有其它的好,但是学习下不吃亏嘛,我反正也不会一起学习基础啦. 例子请使用手机查看哦内容区域格式布局网格布局 jquery mobile提供一种多列布局功能,由于移动设备的屏幕大小原因,一般情况还是不要使用多列布局啦. jquery mobile提供一种css样式规则来定义多列布局,对应css为ui-block,每列的样式是通过定义前缀+“-a”等方式对网格的列进行布局,a字母…

【初探移动前端开发03】jQuery Mobile（上）

前言到目前为止,我打了几天酱油了,这几天落实了工作,并且看了一部电视连续剧(陈道明-手机),我很少看连续剧了,但是手机质量很高啊,各位可以看看. 我们今天先学习一下jquery mobile的基础知识,然后逐步进入移动开发吧. 我们这里再来看看响应式布局,我们是一个页面可以在不同的设备上使用,其实这在某些方面上是不太合适的. 因为我们移动端的事件不太一致,可能鼠标操作很方便的,用手就不行了,所以为移动端出单独的网页还是很有必要的. 文中测试链接请使用手机打开. 什么是jQuery Mobile…

移动开发必备！15款jQuery Mobile插件

移动互联网的发展,来自PC端的网页并不能完全自适应移动端页面需求,使得响应式设计体验产生并成为潮流,也正是这样一种需求,促成了jQuery Mobile的流行.jQuery Mobile这样一款基于jQuery和jQuery UI的框架,继承了jQuery的“write less,do more”精髓,具有良好的扩展性和可定制性,全面兼容各种平台设备,对于不支持的手机类型,也会予以基础样式. 本文细数了15款非常优秀而又实用的jQuery Mobile插件,类型甚广,从日期/时间选择.即时声音通…

探索开发跨平台移动App，谈Jquery Mobile 和PhoneGap应用

随着智能手机等设备的大范围普及,各形各色的移动端软件随之既出.各互联网运营商也都在抢占移动软件的占有率.不惜采用财力进行宣传推广.例如,通过手机淘宝客户端购买物品总比pc端要便宜,360手机助手下载对应软件可得开发者红包等等. 目前各移动端所运行的系统也有不少,android.wp.ios等等.面对不同的系统,开发者往往要根据需求开发不同系统下的对应版本,作为企业则要招聘懂各种语言的开发人员,进行移动端开发,需要耗费很多的财力物力.不能最佳的利用. 因此,为了统一各移动平台,使开发一款产品就可以…

11-移动端开发教程-zepto.js入门教程

Zepto.js是一个轻量级的针对现代浏览器的JavaScript库, 它与jquery有着类似的api. 如果你会用jquery,那么你也会用zepto. 1. Why Zepto.js? API类似jQuery,熟悉jQuery可以无缝迁移到Zepto.js Zepto仅针对高版本现代浏览器设计了最小核心的通用库,代码体积小,尤其适合移动端开发. Zepto增加了针对移动端的触摸和手势相关的事件 Zepto模块化做的很灵活,可以自定义组合模块 2. Zepto.js下载代码下载:zepto…

利用JQuery Mobile开发web app

什么是web app web app 是基于web的应用程序,是针对移动设备优化后的web站点,它具有开发成本低——采用web开发技术,不需要考虑跨平台以及底层适配问题: 升级简单——不需要通知用户,在服务端更新文件即可: 维护方便——本质是站点,所以维护方式于web站点相同等优点.开发web app使用的技术:前端 html5 + css + JavaScript / 后端 php | java | .net. 随着 html5 的发展,我们能使用越来越多的功能,比如:地理定位.本地数据储…

【初探移动前端开发04】jQuery Mobile 一

网格布局 jquery mobile提供一种多列布局功能,由于移动设备的屏幕大小原因,一般情况还是不要使用多列布局啦. jquery mobile提供一种css样式规则来定义多列布局,对应css为ui-block,每列的样式是通过定义前缀+“-a”等方式对网格的列进行布局,a字母根据网格的列数而定. 例如两列布局CSS为:ui-block-a与ui-block-b <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml…

在DW 5.5+PhoneGap+Jquery Mobile下搭建移动开发环境

移动设备应用开发有多难,只要学会HTML5+Javascript就可以.用Dreamweaver5.5+PhoneGap+Jquery Mobile搭建移动开发环境,轻轻松松开发你自己的应用.让你用普通的web技术编写出能够轻松调用API接口和进入应用商店的HTML5应用开发平台. 安装Dreamweaver5.5 这里要注意,Dreamweaver5.5的内部版本需要5344,也就是目前最新的版本.现在一般网上下载的都是5315,破解后可以用软件自带的更新到5344. 破解的方法如下: 用记事…

【初探移动前端开发05】jQuery Mobile (下)

前言继续我们移动端的学习,今天到了List相关了. 本文例子请使用手机查看 List列表在移动设备平台下,由于移动设备屏幕比较小,我们又是用手在上面点击的触屏方式,传统的列表模式在手机上就不太友好了. 虽然HTML5与CSS3提供了强大的界面实现方案,jquery mobile作为jquery框架的一个移动web插件,他根据移动屏幕大小优化了UI组件, 列表组件就是jquery mobile根据移动设备的特性而实现的组件库之一. 我们来一个个看看我们的列表吧普通链接列表 <!DOCTYPE…

经典收藏 50个jQuery Mobile开发技巧集萃

http://www.cnblogs.com/chu888chu888/archive/2011/11/10/2244181.html 1.Backbone移动实例这是在Safari中运行的一款Backbone移动应用程序.想开始体验移动开发,一个好的出发点就是关注这个应用程序的构建方式.先不妨在你的浏览器中查看该应用程序. 相关链接:http://bennolan.com/2010/11/24/backbone-jquery-demo.html 2.使用媒体查询来锁定设备你可能会问如何使用…

jquery mobile 和phonegap开发总结之三跨域加载页面

跨域加载一要进行一定的配置见下面 $( document ).bind( "mobileinit", function() { // Make your jQuery Mobile framework configuration changes here! $.mobile.allowCrossDomainPages = true; }); 而,有时候开发在真机测试比较麻烦,所以建议使用谷歌浏览器进行测试,允许file协议 "C:\Program Files\Google\…

PhoneGap与Jquery Mobile组合开发android应用的配置

PhoneGap与Jquery Mobile结合开发android应用的配置由于工作需要,用到phonegap与jquery moblie搭配,开发android应用程序. 这些技术自己之前也都没接触过,可以说是压根没听说过,真是感慨,在开发领域,技术日新月异,知识真是永远学不完的.就算是做java开发的,可是细分下来,专业方向还是很多的:自己没有涉及的技术还是太多了,自个需要对单个领域专业点,知识丰富点.做不了全才,那咱做个专才,在如今社会还是必须的. 好了,咱们言归正传: PhoneGap…

(转)jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明

(原)http://www.cnblogs.com/hxling/archive/2012/12/12/2814207.html jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明近期在移动方面的开发,使用jQuery Mobile ,移动方面的插件不如Web 方面的插件多,选择的更少,有一些需要自己去封装,但功力尚不足啊. 日期插件JQM也提供了内置的,但样式方面不好看,只好百度.Google啦,找到了两款 jquery-mobile-datebox…

jquery mobile开发笔记之Ajax提交数据（转）

http://my.oschina.net/xiahuawuyu/blog/81763 这两天学习了下,jquery mobile(以下简称jqm)的开发相关的内容.可能之前有过web的开发基础,相对于我来说学习这个东西感觉挺简单的,很容易上手.Jqm的的语法和jquery其实是一样的,有些不大一样的就是了.网上介绍的也是一大堆.这里我主要是做笔记哈. 使用JQM开发其实很简单,我这里目前是针对于在服务器端开发的,服务器使用的是apache+php,前端其实主要是html5+jquery的写法.…

jQuery Mobile 移动开发中的日期插件Mobiscroll使用说明

近期在移动方面的开发,使用jQuery Mobile ,移动方面的插件不如Web 方面的插件多,选择的更少,有一些需要自己去封装,但功力尚不足啊. 日期插件JQM也提供了内置的,但样式方面不好看,只好百度.Google啦,找到了两款 jquery-mobile-datebox 和 mobiscroll-2.3 jqueryMobileDatebox 这个在板上的表现不好,性能方面有点卡 mobiscroll 性能方面比前者要好一些,效果更简洁 ,划动更流畅放在一起对比下各位看官,你们觉得哪个…

使用jQuery Mobile + PhoneGap 开发Android应用程序(转)

使用jQuery Mobile + PhoneGap 开发Android应用程序(转) 一.简介 jQuery Mobile是jQuery在手机上和平板设备上的版本.jQuery Mobile 不仅给主流移动平台带来jQuery核心库,而且提供了一个完整统一的jQuery移动UI框架.支持全球主流的移动平台.它拥有出色的弹性,轻量化以及渐进增强(Progressive enhancement)特性与可访问性.jQuery Mobile 1.0构建于jQuery核心1.6.4. PhoneGap是…

html5文章 -- 使用 jQuery Mobile 与 HTML5 开发 Web App ——开发原则 | Kayo's Melody

最近专注研究 jQuery Mobile —— 一款很方便就可以把 Web App 包装成适合 Android 与 iPhone 等触屏移动设备的 Javascript 库,结合 jQuery Mobile 与 HTML5 ,可以很方便的开发出一款具有良好界面及用户体验的 Web App,在这个过程中我收获良多,因此决定针对使用 jQuery Mobile 与 HTML5 开发 Web App 写一个系列的文章.在开始之前,我首先简述 Web App 与原生 App 各自的优缺点. 一. Web…