`
lizaochengwen
  • 浏览: 662470 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

使用jQuery Mobile开发Web App-页面切换动画 android

阅读更多
jQuery Mobile包含一组基于CSS3的过渡动画(又称转场效果),可以应用在任何页面或page组件切换。jQuery Mobile默认对页面切换和返回按钮设置了滑动(slide)效果。

要设定一个特定过渡效果,只需要在链接上添加一个data-transition属性,可以使用以下属性值:
<a href="index.html" data-transition="pop">I'll pop</a>
jQuery Mobile提供了6种切换动画:slide(滑动)、slideup(向上滑动)、slidedown(向下滑动)、pop(抛出)、fade(淡入淡出)和flip(3D翻转)。动画效果见这里。

注意:flip效果在大多数android浏览器上不能被正确渲染,因为缺少对3d css transform的支持。不幸的是android并没有忽略flip效果,而是使用水平翻转来替代。所以建议在android完美支持之前谨慎使用flip效果。

此外,你可以使用data-direction=”reverse”来设定反向的过渡效果,比如对slide效果(从右往左)使用data-direction=”reverse”则会变成从左往右,对pop效果(从小到大抛出)使用data-direction=”reverse”则会变成从大到小消失。

今天老总跟我们聊天,说了很多技术的东西,有很多关于线程和内存的内容,凭我现在的水平,不理解其说的内容,以后要在这方面多加注意些,注重性能优化。
在软件行业,要实时跟上软件发展的进程。老总有个比喻,是这样的。菜市场每天都有很多新鲜的菜进入,如果你抱着一捆不新鲜的菜来买,即使你人缘再好,老主顾也会离你而去,更别说其他。
分享到:
评论

相关推荐

    用jQuery Mobile创建Web App

    《使用jQuery Mobile构建Web App详解》 在当前的互联网环境中,Web App已经成为移动设备上不可或缺的应用形式。jQuery Mobile,作为一款强大的前端框架,为开发者提供了简单、高效的手段来创建响应式、触摸友好的...

    jQuery-Mobile-Bootstrap-Theme-master

    在Web开发领域,jQuery Mobile和Bootstrap是两种非常流行的前端框架,它们各自为开发者提供了强大的工具和组件,以构建响应式、移动优先的网页应用。当我们谈论"jQuery-Mobile-Bootstrap-Theme-master"时,这通常...

    jQuery-Mobile-Bootstrap-Theme

    `jQuery Mobile` 和 `Bootstrap` 是两个广泛使用的前端开发框架,它们各自在移动和Web应用设计上有着独特的优点。`jQuery Mobile` 专注于提供跨平台、触摸友好的UI组件,而 `Bootstrap` 则以其响应式布局和丰富的...

    用jQuery-Mobile创建Web-App最新版本

    本文档主要讲述的是用jQuery-Mobile创建Web-App;移动互联网的发展,促生了各种各样的移动Web框架。jQuery就是一款优秀的轻量级JavaScript框架,简化HTML5与JavaScript之间的操作。本文就详细介绍如何通过jQuery来...

    jquery-mobile-theme-174943-0

    在Web开发领域,jQuery Mobile是一个广泛使用的框架,它为构建响应式、触屏友好的移动应用提供了强大的工具。本主题,"jquery-mobile-theme-174943-0",是jQuery Mobile众多主题中的一个,它为开发者提供了统一的...

    JqueryMobile快速上手教程-实训任务书01-我的第一个JqueryMobile页面

    为了在页面间平滑切换,jQuery Mobile 使用 AJAX 来加载新页面,并通过 `data-url` 属性保持页面历史记录。 ### 五、交互组件 jQuery Mobile 提供了许多内置的交互组件,如按钮、表单、下拉菜单、滑块等,它们都...

    《构建跨平台APP-jQuery.Mobile移动应用实战》 PDF

    第三篇是跨平台APP实战篇,介绍了6个使用jQuery Mobile开发的实际APP;第四篇是发布和推广应用篇,介绍了在开发完成之后,如何发布和推广自己的APP。本书内容详尽、实例丰富,是广大jQuery Mobile初学者、跨平台移动...

    jquery.mobile-1.4.5

    jQuery Mobile 的核心目标是简化跨平台的移动Web开发,通过一套统一的API和CSS样式,使得开发者能够创建一致的交互体验,无论是在iOS、Android还是其他移动平台上。1.4.5版进一步优化了性能和可定制性,以满足多样...

    前端项目-jquery-smart-web-app-banner.zip

    【前端项目-jquery-smart-web-app-banner.zip】是一个前端开发资源包,主要目的是为了帮助开发者在网站上实现一种智能的Web应用横幅功能。这种功能可以让用户方便地将网站保存到他们的设备主屏幕上,如同安装了一个...

    使用jquery-mobile+html5实现android本地通讯录

    在移动应用开发中,将HTML5、jQuery Mobile和Android结合可以构建出跨平台的轻量级应用程序,尤其适合快速原型开发或对原生功能的轻度集成。本教程将聚焦于如何利用jQuery Mobile和HTML5来访问并操作Android设备上的...

    jquery.datepicker-zh-CN.js

    &lt;script src="./public/js/jquery-ui-1.10.3.min.js"&gt; &lt;script src="./public/js/jquery.datepicker-zh-CN.js"&gt;&lt;/script&gt; &lt;link href="./public/css/jqueryui/jquery-ui-1.10.3.min.css" rel="stylesheet"&gt; $( "#...

    jquery mobile web api开发例子

    在Web应用开发中,jQuery Mobile 和 Web API 结合使用可以构建出功能强大且响应式的移动应用。本教程将深入探讨如何利用jQuery Mobile与C#实现的Web API2接口进行交互,展示列表数据。 **jQuery Mobile 简介** ...

    实训 jQuery开发交互效果页面--留言页面.pptx

    8. jQuery 的应用场景:jQuery 广泛应用于 web 开发领域,例如:构建交互式网页、开发单页应用程序、实现动画效果等。 9. jQuery 的优点:使用 jQuery 可以提高开发效率、简化代码、提高可维护性等。同时,jQuery ...

    jquery.mobile-1.4.2

    《jQuery Mobile 1.4.2:移动应用开发利器》 在移动互联网飞速发展的今天,jQuery Mobile作为一款强大的前端框架,为开发者提供了构建响应式、触摸友好的移动Web应用程序的强大工具。尤其对于jQuery Mobile 1.4.2...

    插件jquery-ui-timepicker-addon.js

    jquery插件jquery-ui-timepicker-addon.j

    HTML5+CSS3+jQuery Mobile轻松构造APP与移动网站_陈婉凌.pdf

    HTML5、CSS3和jQuery Mobile是现代Web开发中的三大核心技术,它们共同构建了丰富的、交互式的移动应用和网站。本书《HTML5+CSS3+jQuery Mobile轻松构造APP与移动网站》由陈婉凌撰写,旨在帮助读者掌握这些技术,轻松...

    JqueryMobile快速上手教程-实训任务书05-页面预加载和缓存-班级通知页.zip

    使用 jQuery Mobile 的页面管理机制,我们可以有效地预加载和缓存这些通知页面,确保用户在滚动浏览或点击查看新通知时,体验到无缝的页面切换。 1. **设计页面结构**:首先,每个通知应作为一个独立的页面,可以...

    jq-mobile案例

    `jq-mobile`,全称为jQuery Mobile,是一款基于jQuery库开发的轻量级、跨平台的移动Web应用框架,专为触摸设备设计。它提供了丰富的UI组件和交互效果,便于开发者快速构建功能完善的、具有原生App体验的移动Web应用...

    jQuery Mobile 所需要的部署文件

    jQuery Mobile 是一个轻量级...总的来说,这个资源包提供了一个基础的起点,帮助你理解并开始使用jQuery Mobile进行移动Web开发。通过研究“Hello World”示例,你可以逐步掌握如何构建响应式的、功能丰富的移动应用。

    jquery-mobile教程--很好很强大哦

    为此,jQuery 社区推出了一款强大的移动 Web 开发框架——jQuery Mobile,帮助开发者轻松构建跨平台的移动应用。 #### 二、jQuery Mobile 的设计理念 jQuery Mobile 遵循“渐进增强”的设计理念,确保网站内容在...

Global site tag (gtag.js) - Google Analytics