非常简单,我有一个指向data-transition="slideup"
的辅助页面的链接。当关闭时,该页面在打开和关闭时向上滑动,但是在单击链接本身时,当前页面在新页面向上滑动之前淡出。同样,关闭辅助页面时,它会向下滑动,然后其他页面会淡入。
我可以禁用此淡入效果吗?我只想让辅助页面滑过当前页面的顶部。
答案 0 :(得分:0)
您正在寻找的是CSS转换定义。我遇到了同样的问题。如果您编辑CSS过渡(转换),那么您应该能够获得所需的效果。
转换定义为<transition name>.in
或.out
。您可以在结构CSS文件中找到它们。对于jQuery Mobile 1.4.2,它们将在jquery.mobile.structure-1.4.2.css
中定义。
以下是slideup(in和out)定义的定义:
.slideup.out {
-webkit-animation-name: fadeout;
-webkit-animation-duration: 100ms;
-moz-animation-name: fadeout;
-moz-animation-duration: 100ms;
animation-name: fadeout;
animation-duration: 100ms;
}
.slideup.in {
-webkit-transform: translateY(0);
-webkit-animation-name: slideinfrombottom;
-webkit-animation-duration: 250ms;
-moz-transform: translateY(0);
-moz-animation-name: slideinfrombottom;
-moz-animation-duration: 250ms;
transform: translateY(0);
animation-name: slideinfrombottom;
animation-duration: 250ms;
}
(这些定义也有reverse
个版本。)
您需要做的就是修改这些CSS转换以获得所需的效果。请注意如何定义动画名称:slideinfrombottom
?这些是在同一CSS文件中预定义的@keyframes
。
在此处修改所有内容应该可以为您提供在jQuery Mobile中调整和调整页面转换所需的一切。
重要提示:在in
转换完成之前,jQuery Mobile不会触发out
转换。如果您也想调整一下,那就完全不同了。我在1.4.2中看到了直接解决并发和同时转换的代码,但我没有彻底探索它。