mobile

Ratchet教程:创建项目

通过前面几篇Ratchet教程的介绍,我想大家对Ratchet有一定的了解,或许都蠢蠢欲动,想自己动手制作一个移动项目出来。是的,我也有这样的冲动,刚好五一这几天以Ratchet框架为基础,帮朋友处理了一个移动端的项目,今天我就以主站W3cplus为例,整一个移动端的W3cplus。

Ratchet教程:自动化部署与组件概览

今天是关于Ratchet教程中的第三篇。在正式表这篇文章之前,首先要非常感谢好友@文彬提供这么优秀的教程。下面我们跟随文彬的教程往下了解。ratchet是一个移动框架,可以用来快速搭建移动项目。本文将介绍grunt服务器搭建,ratchet组件的使用。

Ratchet教程:meta与link标签

通过《Ratchet教程:安装》一文,大家对Ratchet有了一个初步的了解。那么从这一节开始,我们一起来开始实战。通过实战来更好的学习和了解Ratchet,更希望学习了Ratchet之后,大家在制作移动页面的时候可以高呼“so easy!”在这一节中以Rathect框架模板文件头部为主导,重新罗列了和标签在移动开发中的作用与功能。详细介绍了模板中所用到的标签功能。同时搜集了部分网上有关于这方面的介绍。希望这些标签功能对大家今后的开发有所帮助。

Ratchet教程——安装

Ratchet是一款使用HTML、CSS和JavaScript用来制作移动网页或App的前端框架。目前最新版本是Ratchet v2.02。从今天开始我们一起来看如何使用Ratchet框架以及现成的组件制作移动网页或者app。首先向大家介绍Ratchet的环境配置与及安装。并向大家展示了使用Ratchet制作的一个简单的移动页面效果。

响应式设计、移动端网站与原生应用的优点和缺点

移动端的优化最近成了一个时髦的话题,将来也会有更多关于这方面的讨论。根据Mashable在2013年8月份发布的统计,可以得知,全球所有网站流量的17.4%都是通过移动设备来的,而这个数字在2014年将会继续增长。所以,你如果不想失去一杯羹的话,是时候步入移动端的领域了。

jQuery Mobile教程-高级篇-原理之组件自动初始化

特别申明:本系列教程由小春撰写

本文我们来深度认识一下jQuery Mobile的内部设计原理中组件如何自动初始化
(注释:下面示例中的代码片段均来自1.1.0版本)
很多看过源码的同学或者使用过jquery mobile的同学们,大家有没有一个很大很大的问题:
------- jquery mobile提供了几个组件,他们如何自动初始化的?
!!重点说明:下面类似的自动初始化的流程多是在pagecreate触发后调用,有关pagecreate相关的说明可以查看我前面的相关介绍

我们挑选其中一个组件:listview

先看一张流程图:

jQuery Mobile教程-高级篇-特殊选择器扩展之:jqmData

特别申明:本系列教程由小春撰写

本文我们来认识一下jQuery Mobile的一个比较特殊的选择器方式
(注释:下面示例中的代码片段均来自1.1.0版本)
很多看过源码的同学,应该多会在很多地方看到下面这种选择器,用过jquery的人都会疑问?
---- jquery本身没有这种选择器类型的支持!

源码示例:

//获取页面data-role="page"和data-role="dialog"的数目
//#7470
var $pages = $(":jqmData(role='page'),:jqmData(role='dialog')")

那我来大家来看一下到底是咋样实现的呢?

源码展示:

jQuery Mobile教程-高级篇-pagecreate事件由来

特别申明:本系列教程由小春撰写

本文我们来深度认识一下jQuery Mobile体系中非常非常非常有用的事件:
--------pagecreate以及pagebeforecreate的由来!
(注释:下面示例中的代码片段均来自1.1.0版本)
很多看过源码的同学,应该多会在很多地方看到下面这种事件绑定,我挑选了第一个出现的地方:

源码实例:

jQuery Mobile教程-高级篇-自动增强主体结构开篇

特别申明:本系列教程由小春撰写

本文我们来深度认识一下jQuery Mobile中一个大致的自动增强的流程设计
还记得我们前面在《jQuery Mobile教程-基础篇-如何开始?》里面提到的一个最简单的页面结构吗?

jQuery Mobile教程-高级篇-网格配置实现细节

特别申明:本系列教程由小春撰写

本文我们来通过源码分析的方式,深度认识一下jQuery Mobile中grid组件的设计实现细节
还记得我们前面在《jQuery Mobile教程-基础篇-网格篇》里面提到的如何设置几列布局吗?

页面

返回顶部