jQuery Mobile Transition Fade

Question

jQuery Mobiles data-transition="slideup"으로 페이지 전환을 수행하면 페이지 자체가 fadeOut이되고 이후에는 페이지의 슬라이드가 발생합니다. 이 문제는 Documentations에도 같은 문제가 있기 때문에 jQuery Mobile 자체와 일치하는 것으로 보입니다.

이 페이드를 비활성화하고 싶습니다. 새로운 페이지를 페이드가 생기지 않고 밀어 넣기를 원합니다. 가능해야합니다. 아마도 간단한 jQuery slideIn()일까요? 하지만 적절한 방법으로 해보고 싶습니다. 아마도이 중 하나를 이미 알아 냈을 것입니다.

참고 : -webkit-backface-visibility: hidden을 시도했지만 실제 슬라이드 업 전환이 수행되었으므로 이와 관련이없는 것처럼 보입니다. 페이지가 사라지 자마자 ....

Answer 1

나는이 문제를 혼자서 해결했습니다.

두 페이지가 #one 및 #two입니다. 버튼을 클릭하면은 #one 페이지 #two이고 하단은 입니다. 이 애니메이션은 페이지에라고 지금

@-webkit-keyframes dontdoshit { 
    from { -webkit-transform: translate(0,0); } 
    to { -webkit-transform: translate(0,0); } 
} 
@-moz-keyframes dontdoshit { 
    from { -moz-transform: translate(0,0); } 
    to { -moz-transform: translate(0,0); } 
} 
@keyframes dontdoshit { 
    from { transform: translate(0,0); } 
    to { transform: translate(0,0); } 
} 

나는 확실히 만들고있어 : 지금은이 같은 사용자 지정 애니메이션을 만든 두 번째 페이지를 밀기 전에 jQuery를 모바일 일반적으로 할 것이 첫 번째 페이지의 페이드 아웃을 방지하기 위해 #one, 그렇지 않으면 페이지가 #two 위로 밀어 올 때까지 사라집니다.

.slideup.out { 
    -webkit-animation-name: dontdoshit; 
    -webkit-animation-duration: 1ms; 
    -moz-animation-name: dontdoshit; 
    -moz-animation-duration: 1ms; 
    animation-name: dontdoshit; 
    animation-duration: 1ms; 
} 
.slideup.in.reverse { 
    -webkit-animation-name: dontdoshit; 
    -webkit-animation-duration: 1ms; 
    -moz-animation-name: dontdoshit; 
    -moz-animation-duration: 1ms; 
    animation-name: dontdoshit; 
    animation-duration: 1ms; 
} 

마지막으로 내가

#one { 
display: block!important; 
z-index: 2; 
} 

을 강제로 내 첫 번째 페이지를 숨기는 jQuery를 핸드폰 스크립트 릿을 방지하고 페이지의 상단에있을 것입니다 그래서 두 번째 페이지에게 더 높은 Z 색인을 준 한

#two { 
z-index: 9999;//this is quite a lot :o 
}