`
LiYunpeng
  • 浏览: 951003 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

关于JQuery Mobile的data-transition不起作用的问题

阅读更多
JQM的页面切换效果

首先是要确保,页面和页面之间的跳转关系是ajax的

那么在JQM中,有两个设置时不让请求变为ajax的
其中一个是rel="external",另一个是data-ajax="false"


如果加上这两个当中的任意属性,则,页面不会是ajax请求

另外一点就是JQM都是基于data-role="page"来的,所以要确保两个页面是基于page的切换

可能说的不太清楚,综上所述

第一,保证页面是ajax请求,如果有rel="external" 或者 data-ajax="false" 则会不起作用
第二,保证页面之间都是基于data-role="page"的,这是JQM页面之间的基础
分享到:
评论
2 楼 LiYunpeng 2014-05-15  
lazyox_2008 写道
给个解决方案啊,楼主,


上面写的很清楚啦,保证两点
第一,保证页面是ajax请求,如果有rel="external" 或者 data-ajax="false" 则会不起作用
第二,保证页面之间都是基于data-role="page"的,这是JQM页面之间的基础
1 楼 lazyox_2008 2014-05-14  
给个解决方案啊,楼主,

相关推荐

    jquery mobile 1.4.5demo和说明

    1. **页面结构**:jQuery Mobile 采用单一页面模式,通过数据-URL(data-url)属性实现页面间的导航。页面结构由数据-role="page" 的 div 元素组成,可嵌套在 data-role="header", "content", 和 "footer" 内,实现...

    jQuery mobile滑动式的标题导航

    jQuery Mobile 是一个轻量级、触控优化的前端框架,专为移动设备设计,它提供了一整套构建移动Web应用程序的组件。在这个“jQuery mobile滑动式的标题导航”主题中,我们将深入探讨如何利用jQuery Mobile创建动态且...

    jquerymobile设计完整例子

    同时,jQuery Mobile 的数据属性如`data-role="page"`和`data-theme`可以调整页面和元素的外观。 2. **菜单系统构建** 菜单在移动应用中扮演着重要的角色。jQuery Mobile 的`<div data-role="navbar">`元素是创建...

    jQuery mobile相册

    4. **数据-翻转属性**:利用jQuery Mobile的"data-transition"属性,可以添加平滑的过渡效果,比如"slide"或"fade",增强用户体验。 5. **自动滚动**:提到的"autoadvance 相册"可能是指相册具有自动滚动功能,这...

    jQuery_Mobile中文手册

    jQuery Mobile 默认提供了平滑的页面过渡效果,可以通过 `data-transition` 属性设置不同的动画效果。同时,`$.mobile.changePage()` 方法可以控制页面切换时的动画和行为。 ### 8. AJAX 导航 jQuery Mobile 默认...

    JqueryMobile1.4.2最新版Demo

    在下载的 "JqueryMobile-1.4.2 Demo" 压缩包中,你可以找到各种示例页面和组件的实践应用,通过查看和分析这些例子,可以更直观地了解 jQuery Mobile 的功能和使用方法。结合实际项目需求,灵活运用这些知识,可以...

    jquery mobile 实例

    jQuery Mobile 自动对表单元素进行了美化,并提供了多种表单组件,如滑块(`<input type="range">`)、切换开关(`<input type="checkbox">` 与数据角色 `data-role="slider"`)和增强的文本输入(`...

    jqueryMobile入门练习项目

    **jQuery Mobile 入门练习项目** jQuery Mobile 是一个...通过这个入门练习项目,你将建立起对 jQuery Mobile 的基本认识,为进一步开发复杂的移动应用打下坚实的基础。不断实践和探索,你会发现这个框架的强大之处。

    JqueryMobile课件源码

    jQuery Mobile 提供了多种页面切换的过渡效果,如滑动、淡入淡出等,可以通过设置 `data-transition` 属性来选择。此外,`data-ajax="false"` 可以禁用 AJAX 导航,使得页面以完整的新页面形式加载。 ### 六、表单...

    ( jQuery Mobile-chs 中文手册

    3. **页面过渡**:jQuery Mobile 自带多种页面过渡效果,如滑动、淡入淡出等,通过设置 `data-transition` 属性控制。 4. **工具栏**:`<div data-role="navbar">` 可用于创建包含多个链接的固定工具栏。 ### 三、...

    jquery mobile 餐厅实例

    2. **主题与样式:** jQuery Mobile 提供了一套主题系统,通过数据属性(如`data-theme`)可以轻松改变元素的外观。 3. **增强型链接:** 通过设置`data-ajax="true"`,jQuery Mobile 可以实现页面无刷新跳转,提供...

    jQuery mobile美化的菜单栏控件

    在网页设计和开发中,jQuery Mobile 是一个强大的框架,它为移动设备提供了丰富的交互和触控优化的功能。jQuery Mobile 的核心理念是简化跨平台的移动Web应用开发,使其具有一致的外观和感觉。"jQuery mobile美化的...

    jQuery Mobile类库

    然而,需要注意的是,虽然jQuery Mobile简化了移动开发,但也可能因默认的增强和自动处理导致性能问题。在性能敏感的应用中,可能需要禁用某些增强或使用更轻量级的库。 总的来说,jQuery Mobile 1.2 版本为开发者...

    Jquery Mobile实例

    8. **页面过渡动画**:jQuery Mobile 支持多种页面过渡效果,如淡入淡出、滑动等,通过 `data-transition` 属性设置。这增强了用户在页面间切换时的视觉体验。 9. **页面数据绑定**:jQuery Mobile 与 jQuery UI 中...

    使用JqueryMobile开发购物网站

    5. **列表视图**:`<ul data-role="listview">`是JqueryMobile中的重要组件,常用于展示商品列表。可以添加子列表、分页、图标等增强功能,同时支持触摸事件,如滑动触发更多操作。 6. **网格布局**:对于商品展示...

    jQuery Mobile十大常用技巧

    jQuery Mobile允许设置页面切换动画,通过`data-transition`属性定义,如`data-transition="slide"`。 8. **动态添加和删除页面**: 可以在运行时使用`$.mobile.loadPage()`加载新页面,或使用`$.mobile....

    Jquery Mobile +侧边栏 效果

    在移动Web应用开发中,jQuery Mobile是一个非常流行的框架,它为构建触摸优化的、响应式的网页提供了丰富的组件和API。侧边栏(Sidebar)是现代Web应用中常见的一种设计模式,用于提供导航、设置或其他辅助功能。在...

    JqueryMobile快速上手教程-实训任务书04-外页设计-班级通知页.zip

    在jQuery Mobile中,每个页面都由一个`<div>`元素标记为`data-role="page"`。页面间可以通过链接或程序跳转,而数据-URL(data-url)属性用于识别每个页面的独特位置。例如: ```html <div data-role="page" id=...

    jQuery mobile滑动和缩略图的新闻导航

    在jQuery Mobile中,可以通过`data-transition="slide"`属性来启用滑动效果。例如,当你在一个链接上添加这个属性,点击后页面会以滑动的方式过渡到目标页面: ```html <a href="news.html" data-transition="slide...

Global site tag (gtag.js) - Google Analytics