diff --git a/css/structure/jquery.mobile.transitions.css b/css/structure/jquery.mobile.transitions.css index 819c3ade..7bccb841 100644 --- a/css/structure/jquery.mobile.transitions.css +++ b/css/structure/jquery.mobile.transitions.css @@ -18,16 +18,4 @@ -webkit-animation-duration: 225ms; -moz-animation-timing-function: ease-in; -moz-animation-duration: 225; -} - - -/* a dummy transition to override animations in non-3D browsers */ - -@-webkit-keyframes nofade { - from { outline:0; } - to { outline:0; } -} -@-moz-keyframes nofade { - from { outline:0; } - to { outline:0; } } \ No newline at end of file diff --git a/css/structure/jquery.mobile.transitions.flip.css b/css/structure/jquery.mobile.transitions.flip.css index 4bfec34d..adafe1d1 100644 --- a/css/structure/jquery.mobile.transitions.flip.css +++ b/css/structure/jquery.mobile.transitions.flip.css @@ -5,44 +5,42 @@ * value. */ -.ui-supported-csstransform3d .viewport-flip { +.viewport-flip { -webkit-perspective: 1000; -moz-perspective: 1000; position: absolute; } -.ui-supported-csstransform3d .flip { +.flip { -webkit-backface-visibility:hidden; -webkit-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */ -moz-backface-visibility:hidden; -moz-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */ } -.ui-supported-csstransform3d .flip.out { +.flip.out { -webkit-transform: rotateY(-90deg) scale(.9); -webkit-animation-name: flipouttoleft; -moz-transform: rotateY(-90deg) scale(.9); -moz-animation-name: flipouttoleft; } -.ui-supported-csstransform3d .flip.in { +.flip.in { -webkit-animation-name: flipintoright; -moz-animation-name: flipintoright; } -.ui-supported-csstransform3d .flip.out.reverse { +.flip.out.reverse { -webkit-transform: rotateY(90deg) scale(.9); -webkit-animation-name: flipouttoright; -moz-transform: rotateY(90deg) scale(.9); -moz-animation-name: flipouttoright; } -.ui-supported-csstransform3d .flip.in.reverse { +.flip.in.reverse { -webkit-animation-name: flipintoleft; -moz-animation-name: flipintoleft; } - - @-webkit-keyframes flipouttoleft { from { -webkit-transform: rotateY(0); } to { -webkit-transform: rotateY(-90deg) scale(.9); } @@ -74,25 +72,4 @@ @-moz-keyframes flipintoright { from { -moz-transform: rotateY(90deg) scale(.9); } to { -moz-transform: rotateY(0); } -} - - - -/* for non-3d supporting browsers, fallback to fade */ -.ui-unsupported-csstransform3d .flip.out, -.ui-unsupported-csstransform3d .flip.out.reverse { - opacity: 0; - -webkit-animation-duration: 150ms; - -webkit-animation-name: fadeout; - -moz-animation-duration: 150ms; - -moz-animation-name: fadeout; -} - -.ui-unsupported-csstransform3d .flip.in, -.ui-unsupported-csstransform3d .flip.in.reverse { - opacity: 1; - -webkit-animation-duration: 300ms; - -webkit-animation-name: fadein; - -moz-animation-duration: 300ms; - -moz-animation-name: fadein; -} +} \ No newline at end of file diff --git a/css/structure/jquery.mobile.transitions.pop.css b/css/structure/jquery.mobile.transitions.pop.css index 6a25f7f0..9f9e9409 100644 --- a/css/structure/jquery.mobile.transitions.pop.css +++ b/css/structure/jquery.mobile.transitions.pop.css @@ -71,40 +71,4 @@ -moz-transform: scale(.8); opacity: 0; } -} - -/* for non-3d supporting browsers, remove the fade and just animate size */ - -.ui-unsupported-csstransform3d .pop.out, -.ui-unsupported-csstransform3d .pop.in.reverse { - -webkit-animation-duration: 200ms; - -webkit-animation-name: nofade; -} - -.ui-unsupported-csstransform3d .pop.in { - -webkit-animation-name: popin-basic; - -webkit-animation-duration: 325ms; -} -.ui-unsupported-csstransform3d .pop.out.reverse { - -webkit-transform: scale(0); - -webkit-animation-name: popout-basic; - -webkit-animation-duration: 325ms; -} - -@-webkit-keyframes popin-basic { - from { - -webkit-transform: scale(0); - } - to { - -webkit-transform: scale(1); - } -} - -@-webkit-keyframes popout-basic { - from { - -webkit-transform: scale(1); - } - to { - -webkit-transform: scale(0); - } } \ No newline at end of file diff --git a/css/structure/jquery.mobile.transitions.slide.css b/css/structure/jquery.mobile.transitions.slide.css index b0d6babe..fbc1e9e5 100644 --- a/css/structure/jquery.mobile.transitions.slide.css +++ b/css/structure/jquery.mobile.transitions.slide.css @@ -149,43 +149,4 @@ @-moz-keyframes slideouttotop { from { -moz-transform: translateY(0); } to { -moz-transform: translateY(-100%); } -} - - -/* in non-3D browsers, get rid of the fade in animation and give them more duration to prevent jumping */ -.ui-unsupported-csstransform3d .slide.in, -.ui-unsupported-csstransform3d .slide.in.reverse, -.ui-unsupported-csstransform3d .slideup.in.reverse, -.ui-unsupported-csstransform3d .slidedown.in.reverse { - -webkit-animation-name: nofade; - -webkit-animation-duration: 500ms; - -webkit-animation-timing-function: ease-out; - -moz-animation-name: nofade; - -moz-animation-duration: 500ms; - -moz-animation-timing-function: ease-in; -} - -/* Also get rid of the fade out animation and use the same timing */ -.ui-unsupported-csstransform3d .slideup.out, -.ui-unsupported-csstransform3d .slidedown.out - { - -webkit-animation-name: nofade; - -webkit-animation-duration: 500ms; - -webkit-animation-timing-function: ease-in; - -moz-animation-name: nofade; - -moz-animation-duration: 500ms; - -moz-animation-timing-function: ease-in; -} - -/* use similiar timing for slides that we don't need to exclude fades from */ -.ui-unsupported-csstransform3d .slide.out, -.ui-unsupported-csstransform3d .slide.out.reverse, -.ui-unsupported-csstransform3d .slideup.in, -.ui-unsupported-csstransform3d .slideup.out.reverse, -.ui-unsupported-csstransform3d .slidedown.out.reverse, -.ui-unsupported-csstransform3d .slidedown.in { - -webkit-animation-duration: 500ms; - -webkit-animation-timing-function: ease-out; - -moz-animation-duration: 500ms; - -moz-animation-timing-function: ease-out; } \ No newline at end of file