css3实现web app翻页过度效果

最近在开发web app页面，要实现滑动翻页，一开始实现的效果是无任何过渡效果的，可是这样子的话页面会闪跳一下，用户体验非常不好。于是我们主管叫我用jquery mobile,可是用了这个库之后，问题来了，跳转到的目标页面，无法加载目标页面引入的外部css文件，最后用css3完美地解决了这个问题；

.pt-page-moveToLeft {
-webkit-animation: moveToLeft .6s ease both;
-moz-animation: moveToLeft .6s ease both;
animation: moveToLeft .6s ease both;
}
@-webkit-keyframes moveToLeft {
from{-webkit-transform:translateX(-100%);}
to { -webkit-transform: translateX(0%); }
}
@-moz-keyframes moveToLeft {
from{-moz-transform:translateX(-100%);}
to { -moz-transform: translateX(0%); }
}
@-o-keyframs moveToLeft{
from{-o-transform:translateX(-100%);}
to(-o-transform:translateX(0%);}
}
@keyframes moveToLeft {
form{transform:translateX(-100%);}
to { transform: translateX(0%); }
}

给整个页面添加一个div,在添加.pt-page-moveToLeft这个类，就可以实现了。