预览模式: 普通 | 列表

jQuery Mobile 中文手册 Ajax开发版(1)

初始化

jQuery Mobile(以下简称jM)在加载的时候会自动的初始化默认配置项,这样我们就不需要为了学习和配置这些参数花费很多的时间了,大大的提高了开发效率。

但是有些时候因为项目的需要我们还是需要对这些参数进行自定义的。在学习jM的初始化参数之前,我们需要先来了解mobileinit事件。

Mobileinit事件

jM的加载事件和普通的jQuery插件有所不同,它会在document.ready事件之前执行。因此我们在需要对jM的默认运行参数进行调整的时候就需要在document.ready事件之前来对这些参数进行设置,jM为我们提供了mobileinit事件来处理加载之前需要执行的代码。

例如:

查看更多...

分类:前端技术 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 5132

jQuery Mobile 中文手册下载

重新整理了前一段时间的jQuery Mobile开发资料,发一个完整的PDF文档。点击下载此文件

Tags: jQuery Mobile 中文手册 下载

分类:前端技术 | 固定链接 | 评论: 3 | 引用: 0 | 查看次数: 6120

按钮

你可以将页面中的任何一个链接通过data-role="button"来声明成为按钮的显示风格。为了风格统一,框架会在页面加载时自动将form类的按钮格式化为jQuery Mobile风格的按钮,不需要添加data-role属性。

框架中包含了一组常用的图标可以用于按钮,用data-icon属性中的参数来定义显示不同的图标效果。

例如:<a href="index.html" data-role="button" data-icon="delete">Delete</a>

查看更多...

分类:前端技术 | 固定链接 | 评论: 1 | 引用: 0 | 查看次数: 5596

模态对话框

模态对话框是一种带有圆角标题栏和关闭按钮的伪浮动层,用于独占事件的应用。任何结构化的页面都可以用data-rel="dialog"链接的方式实现模态对话框应用。

例如:<a href="foo.html" data-rel="dialog">Open dialog</a>

这个页面切换效果同样可以使用标准页面的data-transition参数效果。建议使用"pop"、"slideup" 和"flip"参数以达到更好的效果。

这个模态对话框会默认生成关闭按钮,用于回到父级页面。在脚本能力较弱的设备上也可以添加一个带有data-rel="back"的链接来实现关闭按钮。

查看更多...

分类:前端技术 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4734


概述

此文档是基于jQuery Mobile框架的移动设备Web应用开发知识而编制,目的是为了方便开发人员快速的掌握此框架的开发应用,其中包含了框架的基础应用知识和在团队协作开发中的常规约定。

框架特性

JQuery Mobile以“Write Less, Do More”作为目标,为所有的主流移动操作系统平台提供了高度统一的UI框架:jQuery的移动框架可以让你为所有流行的移动平台设计一个高度定制和品牌化的Web应用程序,而不必为每个移动设备编写独特的应用程序或操作系统。

jQuery Mobile目前支持的移动平台有苹果公司的iOS(iPhone,ipad,iPod Touch),Android,Black Berry OS6.0,惠普 WebOS,Mozilla的Fennec和Opera Mobile。今后,将增加包括Windows Mobile,Symbian和MeeGo在内的更多移动平台。

查看更多...

分类:前端技术 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 6028

iPhone 4再一次的改变

 

当前的软件产品,整体来说设计方面的薄弱可谓弱中之弱。大多产品开发中对编码的偏重:目前中国的软件公司开创者,多为编程技术出身,为此对程序编码的宠爱有加也就成为自然,应该承认,产品的思想性、运行速度和稳定性无庸置疑,产品业务的核心地位也从没有人怀疑过,然而,作为产品用户和计算机交互核心以及产品形象工程的UI环节一直尚未得到开发者应有的重视。产品一旦投放市场,当界面遭到用户非议的时候,才会想到花上可怜的一点时间和金钱把产品做以“美化”(仅仅是美化),而这种敷衍最终往往难以得到用户的接受。所以说设计绝对不是单单对产品美化的工作。

 

查看更多...

分类:用户体验 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 3796

汇总本年度移动终端设备应用程序和热点问题之后,不难看出其中的趋势性特征,如精致的界面、操作体验、基于硬件的应用和消息推送等问题。可以预计的是,在2011年的产品设计中这些特征会逐渐得到强化。

精致实用的界面

精致实用的界面

自从iPhone 4视网膜屏幕(Retina Display)发布,成为迄今为止在移动设备上能见到的最细腻、显示细节最清晰的屏幕,326显示精度比普通印刷品还要高,而以往普通移动终端设备的96像素,Android平台各种移动终端设备在120-240像素区间内,iPhone 4之前的屏幕也只有164像素。

查看更多...

分类:用户体验 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4107

跨浏览器开发经验总结(1)

image

关于web开发中在各种浏览器中有完全一样的表现是很多人的目标,然而这是一个永远无法真正实现的目标,但在很多情形,一种近似的兼容还是相对容易实现。本文将跨浏览器开发和测试测试有关的各种问题与知识。

浏览器家族

一般来说,跨浏览器是指针对不同的渲染引擎: Trident,Gecko,Webkit,Presto 等。

由于不同浏览器对标签,样式表的解释不尽相同,所以需要为html文件定义一个标准的文档类型,使不同浏览器尽量按照一个统一的html标准来解析渲染页面。

Html标记

!DOCTYPE 声明指定文档遵从的 DTD,如:

查看更多...

分类:前端技术 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 3347