博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

css3实现jquery mobile的页面过度原理

Posted on 2014-07-23 16:52  人生梦想起飞  阅读(883)  评论(0编辑  收藏  举报

1.两个页面在同一个html中用js点击实现另外一个页面增加ui-page-active slid in等各种效果,每个页面中是一个绝对定位

.ui-mobile [data-role=page] {
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    position: absolute;
    display: none;
    border: 0;
}

2.两个html之间过度(即页面是两个html不是在同一个html中)原理可以是直接在每个页面写出动画效果,即在页面加载前事先就已经把个动画效果样式ui-page-active slid in等个种效果的calss放在页面中,这样进入页面就开始动画效果和点击事件一样的效果