说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

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

HTML文档下载 WORD文档下载 PDF文档下载
本文细数了15款非常优秀而又实用的jQuery Mobile插件,类型甚广,从抽屉式导航菜单、iOS style、手风琴导航、隐藏/显示密码、灯箱特效,到颇为酷炫的交互式地图、页面震动、相册/画廊展示等,总有一款会让你着迷。

移动互联网的发展,来自PC端的网页并不能完全自适应移动端页面需求,使得响应式设计体验产生并成为潮流,也正是这样一种需求,促成了jQuery Mobile的流行。jQuery Mobile这样一款基于jQuery和jQuery UI的框架,继承了jQuery的“write less,do more”精髓,具有良好的扩展性和可定制性,全面兼容各种平台设备,对于不支持的手机类型,也会予以基础样式。


本文细数了15款非常优秀而又实用的jQuery Mobile插件,类型甚广,从日期/时间选择、即时声音通知、抽屉式导航菜单、iOS style、手风琴导航、隐藏/显示密码、灯箱特效,到颇为酷炫的交互式地图、页面震动、Native、相册/画廊展示等,总有那么一款会让你着迷。

1. Mobiscroll

对于许多开发者而言,Mobiscroll并不陌生,甚至可以说是相当熟悉。Mobiscroll是一款很不错的jQuery Mobile插件,主要用于触屏设备的旋转滚动/日期和时间选择。通过它,用户只需滑动数字即可进行日期和时间选择(点击链接查看Demo)。


Mobiscroll不仅支持任意自定义值,让用户完全自定义主题,还可用于下拉列表本地选择控制。此外,使用起来也是非常方便,不仅为开发者提供了相当高大上的配色方案,而且可完全通过CSS文件进行样式修改。支持包括iOS、Android、WP8、Windows 8、BlackBerry等在内的所有主流移动及桌面浏览器。

2. Ion.Sound

今时今日,无论是Web还是移动网站,都充斥着各种各样的事件,比如新邮件、新聊天信息、内容更新等。但却常常存在着这样一个问题,就是即时通知无法立即引起用户注意。而通过Ion.Sound插件,则可以很好地实现这一任务。


Ion.Sound是一款用于播放事件声音的jQuery插件,采用MIT许可证,包含有25种免费声音。截至目前,Ion.Sound已成功运用于Google Chrome、Mozilla Firefox、Opera、Safari、IE(9.0+)等桌面浏览器,并支持所有主流移动浏览器。

3. jQuery.mmenu

jQuery.mmenu是一款用于创建平滑的抽屉式导航菜单的jQuery插件,只需短短一行JavaScript代码,即可在移动网站中实现类似于移动App外观的非常酷炫的滑动菜单。


通过jQuery.mmenu,开发者可以将无序列表转换成菜单项,并进行自定义设置。jQuery.mmenu不仅为开发者提供了诸如打开、关闭、切换等常用菜单的定制,还提供了菜单位置(居左/居右)、是否显示菜单项计数器等选项的设置。

4. Naver

Naver是一款专门用于创建响应式导航的jQuery插件。通过它,开发者可以轻易地制作出对移动端非常友好的导航效果,还可制作动态导航。Naver兼容Firefox、Chrome、Safari、IE(7+),基于MIT许可证发布,无论是个人或商业项目中,均可自由免费使用。


5. iosOverlay.js

iosOverlay.js是一款用于创建iOS风格的提示/通知效果的jQuery插件,支持IE7+、Google Chrome、Firefox、Opera、Safari(桌面版及移动版)。需要提醒的是,如果想要防止图标在加载时闪烁,开发者需要预加载图像资源。


此外,iosOverlay.js还存在两个可选的依赖项,即Spin.js和jQuery。如果开发者想使用其下拉列表对象,就必须要用到Spin.js,而对于不兼容CSS动画的浏览器,则需jQuery提供支持。

6. Easy Responsive Tabs

Easy Responsive Tabs是一款轻量级的响应式Tab选项卡/手风琴导航jQuery插件,支持同一页面使用多个范例,跨平台支持Web、平板电脑及移动设备。该插件能够自适应屏幕大小,默认样式为水平/垂直Tab选项卡,随着窗口变小,会自动切换为手风琴样式。


7. Hide/Show Password

Hide/show Password插件可以让你轻易隐藏和显示密码输入框中的内容。该插件最酷的地方就是“innerToggle”选项。当设置为开时,开发者可以自定义创建非常漂亮的隐藏/显示控件。而且在触屏浏览器中进行滑动时还可保持输入焦点。


8. Swipebox

Swipebox是一款精美的jQuery灯箱特效插件,可用于桌面、移动和平板设备。在移动设备上,支持滑动手势导航,而在桌面上则可使用键盘导航。不支持CSS3过渡特性的浏览器可使用jQuery降级处理,支持视网膜显示,能够通过CSS轻松定制。


当用户点击目标图片时,照片将会以全尺寸的方式展示,此外,用户还可对同组的图片进行左右切换来进行查看,非常适合用于做照片画廊以及查看大尺寸图片。

程序员技术分享:训练机器学习 SVM算法解析 2013,谷歌的数据科学家都将干什么呢? Facebook“也”对服务器进行浸泡冷却 日本最大电脑商:Windows 8表现并不好 日均新增415个应用,Windows 8应用总数突破35000 百度推出图像搜索引擎“百度识图” 可基于图像实现全网人脸搜索 解决专利纠纷 RIM向诺基亚预付6500万 巨头的得意与失落:2012移动游戏十大收购案 Mozilla或许将发布iOS平台浏览器Junior Mozilla:Facebook手机将采用Firefox OS Anonymous2013年将放慢脚步,McAfee预测遭质疑 一周消息树:Facebook公布2012年Hackathon大赛顶级“黑客作品” HTML+CSS+JS 开发 Firefox OS 应用编程实战 前端开发工程师如何在2013年里提升自己 Java受Objective-C影响很大 而不是C++ Instagram回击报告指责:用户仍保持增长态势 回顾:2012年科技行业十大败笔 苹果地图入选 Amazon CEO Jeff Bezos:好年景,大挑战 2012年度盘点:移动互联网大事件回顾 详解Amazon Redshift 移动周报:再见,2012!你好,2013! 英特尔或在2月宣布其电视计划:提供分类频道 Prismatic:用机器学习分析用户兴趣只需10秒钟 谷歌布局亚太地区数据中心建设 服务响应速度有望提升30% 2013年移动互联网行业技术趋势前瞻 老骥伏枥志在千里:回顾微软这一年 2013或将崛起 水落石出:在与谷歌苹果竞购创业公司中微软胜出 用扁平化的界面设计吸引用户 2012年12月份全球主流浏览器市场份额排行榜 冲榜不一定要刷榜:增加游戏曝光度的7大杀手锏 科技vs政治:FTC对Google的反垄断调查结束背后 pb,delphi,vb三种快速成型的语言都分别适合开发那些软件?欢迎大家来讨论 请问各位同仁如何设置sybase anywhere服务器参数? 串口通讯能否用pb做成动态连接库的形式?(急) 怎样使Response.redirect打开一个新窗口 为什么环境变量替换不正确? 怎么打开foxpro中,通过剪切板考过去的图片,dbimage和image控件都不能打开,显示“bitmap is not valid” vaj中如何使用自己的JAR? 怎样改变当前窗口的大小,是当前窗口最大化? 高手争峰 如何把一个log文件读到数据结构中去 请教一个很菜的问题:) 这个程序有什么问题? 怎样做???? 简单问题,可就是搞不定!! 请问jsp中servelet在win2000中的设置方法,需要下载什么类库文件么? 一个新问题,那就是点击工具栏的退出按钮以后只退出当前打开的窗口,而不是整个应用! 如何在 index.htm 中引用 count.asp ? 远程数据库访问的问题--亟待高手们解答 王国荣的电子信箱是哪里? 我的程序生活 先给50分,稍后在加:我正在做一个系统,需要做到每次开机时提醒用户有哪些事情要做! [Tips]获取Memo&Richedit中光标坐标的最简单方法! 急急,如何才能把图片的底色与窗口的底色自然地融为一体? 如何改变按钮的颜色? 在mtml help workshop 中如何制作带上下文关联ID的帮助 调试程序时,控制台程序与直接建立的C++程序有区别吗? 给菜鸟推荐本书 VB调用外部DLL问题 【洗心革面,重新做人,割发断指,庄严声明】 从今以后 kook 不近女色,不灌疯水,以 panda_w 为榜样,苦练VC,研习汇编,做一个 CSDN 的正面典型! 谁有ULTRAEDIT 的注册码 能否推荐几本关于VB提高和关于VB数据库的书 紧急问题,关于SSL通过MS PROXY String类的问题 连接数据库的东东真是奇怪! 如何打开pdm格式文件 ===========灌水传说=========== 奇怪的问题,怎么办? 呵呵,初学者,请多多指教 剖 尸 小问题:自定义组件的显示 怎样打印picturebox中的内容??? 关于Datawindow的Group的问题 谁能告诉我 Delphi6的序列号 紧急问题,关于SSL通过MS PROXY! 请问,如果用ASP作邮件发送,接收的功能,win2k怎么设置????????? 各位大侠,谁用visual age for java3.5 开发过 ejb呀,发个例子及过程给我好吗?没例子,有过程也可以!以分做谢! 哪位大哥能将解一下notify()和wait()的用法 我用delphi做的工程是一个exe+n个DLL的,请问datamodule放哪里合适;请高手们详细讲讲. 如何除去这可恶的标题? 请问如何取得动态数组的维数,换言之如何取得动态数组的值? 1000M,一会儿就满了,怎么回事? 为了迎接2012年的元旦,实验小学准备制作一些小红花,平均分给一些同学制作,如果7个人做,则多做3朵,如果4个人做,则少做2朵,如果9个人做,则多做5朵.你知道他们最少想做多少朵.(用最大公因 小红在班级小银行储蓄的钱数是小刚的2分之3,后来小红又存进4元钱,而小刚取出6元钱此时小红的钱数是小刚的钱数的4分之3,现在小刚,小红各储蓄多少元? 买同一个书包,小明花去了他所带钱的5/8,小红花去了她所带钱的3/5求两个人所带钱的比,如果是方程就要把解的过程详细的打出来好么 怎么剪小红花 小红体重与小亮的比2比3.小亮与小刚体重的体重3比4.那么小红和小刚的体重比是多少 小明和小红一共有250元,当小明花掉他自己的5分之2,小红花掉40元后两人剩下的钱相等求小明原来的钱是多少? 老师把一些小红花分给同学,如果减少一个同学,每人正好分5朵,如果增加一个同学,每人正好分4朵一共有多少朵小红花? 小红的存钱是小刚的三分之二,小红存进4元,而小刚取出6元,这时小红是小刚的四分之三,小红和小刚各?元 小红和小明带同样多的钱去买练习本.小红花光了自己的钱,并向小明借1元钱,刚好买了8本练习本 我今天语文课得了朵小红花,求英语 小红在班级小银行存储的钱是小刚的三分之二,后来小红有存进4元,而小刚取出6元钱小红在班级小银行储蓄的钱数是小刚的三分之二,后来小红又存进4元钱,而小刚取出6元钱此时小红的钱数是 小莉买文具和图书共用去54元,其中买图书的钱数比买文具的2倍还多3元,买文具和图书各用多少元? 修改病句:国庆节那天,天安门前挂满了五颜六色的红旗 小林在少儿银行存款50元,小刚存款88元,以后小林每月存5元,小刚每月存12元,几个月后小刚存款数是小林存款数的2倍?求算式,急!谢谢 假期里,小莉用一天学习时间的45%看课外书,她每天看课外书时间是90分,小莉每天用于学习的时间有多长?小莉每天用于学习的时间占一天的百分之几? 广场上到处是五颜六色的红旗(修改病句) 小红在班级小银行储存的钱数是小刚的3分之2,后来小红又存进4元钱,而小刚取出6元钱此时小红的钱数是小刚4分之3,现在小刚小红储存多少元钱? 一.1.小星和小莉看课外书,小星看了40页,是小莉所看页数的5分之4.小莉看了多少页?2.小星和小莉看课外书,小星看了40页,比小莉所看的页数多4分之1.小莉看了多少页?3.小星和小莉看课外书,小星 节日的校园里,插满了五颜六色的红旗.(修改病句) 小红在班级小银行储蓄的钱数是小刚的2分之3,后来小红又存进4元钱,而小刚取出6元钱此时小红的钱数是小刚的钱数的4分之3,现在小刚,小红各储蓄多少元?小红在班级小银行储蓄的钱数是小刚 假期里,小莉用一天学习时间的45%看课外书,她每天看课外书的时间是90分.小莉 修改病句:校园里生满了白的、红的、黄的等五颜六色的花. 小红在班级小银行里储蓄的钱数是小刚的三分之二,后来小红又存进4元,而小刚取出6元,此时小红的钱数是小刚钱数的四分之三,现在小刚.小红各储蓄多少元? 小莉看一本书,5天看了全书的20%,照这样计算,把剩下的书全部看完还需多少天? 春风吹得满山的桃树绽开了五颜六色的花,一片火红,非常精彩.修改病句按题修改 小红在班级小银行储蓄的钱数是小刚的三分之二,后来小红又存进4元钱,而小刚取出6元钱此时小红此时小红的钱数是小刚的钱数的4分之3,现在小刚,小红各储蓄多少元?要方程和算式不要方程 要 小明和小莉出生于1999年10月份,他们的出生日期不是同一天,但都是星期三,且小明比小莉出生早,两人出生日期之和是22,那么小莉的出生日期是( )A:15日 B:16日 C:17日 <修改病句> 1.公园里生长着各种树和五颜六色的鲜花请修改以上病句 小红的零花钱比小刚多4分之1,小晓的零花钱比小刚的少3分之1.小红和小晓的零花钱相差14元.三人各有零花钱多少元? 小明和小莉出生于1999年12月份他们的出生日他们的出生日不是同一天,但都是星期一 病句:春天公园里五颜六色的花,竞相开放.请问怎么修改?急 这次考试小红考了98分.小红比小刚的分数的七分之八还多2分.你知道小刚考了多少分吗? 小明和小莉出生于1998年12月份,他们的出生日不是同一天,但都是星期五,且小明比小早,两人出生日期之和是29,那么小莉的出生日期是()A、15号 B、16号 C、17号 D、18号 孩子穿着红衣服和白帽子(修改病句) 小红捐360小刚是小红的9分之10小刚捐的是小红的8分之7小刚捐了多少元? 《黄冈小状元》的问题:小明买了2kg梨,共22个;小莉买了3kg梨,共24个,两个人买的梨平均每个各是多少千克?谁买的梨大些? 改病句:他穿着一身崭新的衣服和帽子. 在一次跳绳比赛中小明跳了92个 小红跳了85个 小刚跳了87个 小敏跳了几个 注.我跳的个数是我们5个的平均数上面的写错了 在一次跳绳比赛中小明跳了92个 小红跳了85个 小刚跳了87个 小敏 【急】小明和小丽出生于1999年12月份,他们的出生日不是同一天,但都是星期五,且小明比小莉出生早,两人出生日期之和是22,那么小莉的出生日期是?(一元一次方程解) “他今天穿着一件新衣服和一顶新帽子”怎么改病句? 学校举行一分钟跳绳比赛,小红跳了120下,小玲跳的下数是小红的八分之九,小刚跳的下数比小玲少十五分之二小刚跳的下数比小玲少多少下?不用方程 刚买了一盆花,不知道是什么花,请问谁知道这是什么花? 改病句:刘艳同学今天真漂亮,穿着新衣服和帽子 一个数是2和3的倍数这个数是 这两盆花是什么花 今天,小芳穿着新衣服和新帽子高高兴兴去上学.(修改病句) 一个数同时是2 3的倍数,这个是数有什么的特征? 我有一盆花,但是不知道什么名字,请问下这是什么花, “尽管明天下雨,我们还要去爬山.”修改病句卷子上的题目急 2和3的倍数的共同特征是什么 中间叶子是红色的周围是绿色的一年四季都是这样是什么花?中间叶子是红色的周围是绿色的一年四季都是这样!买时老板说是叫富贵什么?不记得了,不知道哪位朋友知道是什么花,知道他的养 看,空中有一道五颜六色的彩虹.(修改病句) 三位同学购物,小明花去钱数的1/2等于小琳花去钱数的1/3,小琳花去钱数的3/4等于军军花去钱数的4/7,结果军军比小明多花93元,他们三人共花了多少钱?急 花像叶子一样是红色的,叶子是绿色的是什么植物,适合什么样的环境生存, 修改病句:明天上午去爬山 小明和小红共带了200元去购物,购完后2人剩下的钱正好相等,已知小明花去的和原来的钱比是3比7,小红花去小红花去的和原来的比是9比13,小明花去多少元 这是什么树?绿色树叶,红色的花 脱下了五颜六色的衣裳 小红花和小明去超市购物,小红买了6个果冻,每个2.1元.小明买了2块巧克力,比你多花3元,每块巧克力多少元 绿色花叶还带红色花叶是什么花?
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn