From 8779c6f3f90bd8b5783580f295b5d1a07e4e0ca1 Mon Sep 17 00:00:00 2001 From: Mika Petteri Korhonen Date: Wed, 13 Jul 2011 06:10:22 -0700 Subject: [PATCH] Edited themes/default/jquery.mobile.transitions.css via GitHub --- themes/default/jquery.mobile.transitions.css | 133 ++++++++++++++++++- 1 file changed, 132 insertions(+), 1 deletion(-) diff --git a/themes/default/jquery.mobile.transitions.css b/themes/default/jquery.mobile.transitions.css index 15365581e2f..7a8cd4b0a08 100644 --- a/themes/default/jquery.mobile.transitions.css +++ b/themes/default/jquery.mobile.transitions.css @@ -9,11 +9,20 @@ -webkit-animation-duration: 1s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; + -moz-transform: rotate(360deg); + -moz-animation-name: spin; + -moz-animation-duration: 1s; + -moz-animation-iteration-count: infinite; + -moz-animation-timing-function: linear; } @-webkit-keyframes spin { from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(360deg);} } +@-moz-keyframes spin { + from {-moz-transform: rotate(0deg);} + to {-moz-transform: rotate(360deg);} +} /* Transitions from jQtouch (with small modifications): http://www.jqtouch.com/ Built by David Kaneda and maintained by Jonathan Stark. @@ -21,129 +30,193 @@ Built by David Kaneda and maintained by Jonathan Stark. .in, .out { -webkit-animation-timing-function: ease-in-out; -webkit-animation-duration: 350ms; + -moz-animation-timing-function: ease-in-out; + -moz-animation-duration: 350ms; } .slide.in { -webkit-transform: translateX(0); -webkit-animation-name: slideinfromright; + -moz-transform: translateX(0); + -moz-animation-name: slideinfromright; } .slide.out { -webkit-transform: translateX(-100%); -webkit-animation-name: slideouttoleft; + -moz-transform: translateX(-100%); + -moz-animation-name: slideouttoleft; } .slide.in.reverse { -webkit-transform: translateX(0); -webkit-animation-name: slideinfromleft; + -moz-transform: translateX(0); + -moz-animation-name: slideinfromleft; } .slide.out.reverse { -webkit-transform: translateX(100%); -webkit-animation-name: slideouttoright; + -moz-transform: translateX(100%); + -moz-animation-name: slideouttoright; } .slideup.in { -webkit-transform: translateY(0); -webkit-animation-name: slideinfrombottom; + -moz-transform: translateY(0); + -moz-animation-name: slideinfrombottom; z-index: 10; } .slideup.out { -webkit-animation-name: dontmove; + -moz-animation-name: dontmove; z-index: 0; } .slideup.out.reverse { -webkit-transform: translateY(100%); + -moz-transform: translateY(100%); z-index: 10; -webkit-animation-name: slideouttobottom; + -moz-animation-name: slideouttobottom; } .slideup.in.reverse { z-index: 0; - -webkit-animation-name: dontmove; + -moz-animation-name: dontmove; + -moz-animation-name: dontmove; } .slidedown.in { -webkit-transform: translateY(0); -webkit-animation-name: slideinfromtop; + -moz-transform: translateY(0); + -moz-animation-name: slideinfromtop; z-index: 10; } .slidedown.out { -webkit-animation-name: dontmove; + -moz-animation-name: dontmove; z-index: 0; } .slidedown.out.reverse { -webkit-transform: translateY(-100%); + -moz-transform: translateY(-100%); z-index: 10; -webkit-animation-name: slideouttotop; + -moz-animation-name: slideouttotop; } .slidedown.in.reverse { z-index: 0; -webkit-animation-name: dontmove; + -moz-animation-name: dontmove; } @-webkit-keyframes slideinfromright { from { -webkit-transform: translateX(100%); } to { -webkit-transform: translateX(0); } } +@-moz-keyframes slideinfromright { + from { -moz-transform: translateX(100%); } + to { -moz-transform: translateX(0); } +} @-webkit-keyframes slideinfromleft { from { -webkit-transform: translateX(-100%); } to { -webkit-transform: translateX(0); } } +@-moz-keyframes slideinfromleft { + from { -moz-transform: translateX(-100%); } + to { -moz-transform: translateX(0); } +} @-webkit-keyframes slideouttoleft { from { -webkit-transform: translateX(0); } to { -webkit-transform: translateX(-100%); } } +@-moz-keyframes slideouttoleft { + from { -moz-transform: translateX(0); } + to { -moz-transform: translateX(-100%); } +} @-webkit-keyframes slideouttoright { from { -webkit-transform: translateX(0); } to { -webkit-transform: translateX(100%); } } +@-moz-keyframes slideouttoright { + from { -moz-transform: translateX(0); } + to { -moz-transform: translateX(100%); } +} @-webkit-keyframes slideinfromtop { from { -webkit-transform: translateY(-100%); } to { -webkit-transform: translateY(0); } } +@-moz-keyframes slideinfromtop { + from { -moz-transform: translateY(-100%); } + to { -moz-transform: translateY(0); } +} @-webkit-keyframes slideinfrombottom { from { -webkit-transform: translateY(100%); } to { -webkit-transform: translateY(0); } } +@-moz-keyframes slideinfrombottom { + from { -moz-transform: translateY(100%); } + to { -moz-transform: translateY(0); } +} @-webkit-keyframes slideouttobottom { from { -webkit-transform: translateY(0); } to { -webkit-transform: translateY(100%); } } +@-moz-keyframes slideouttobottom { + from { -moz-transform: translateY(0); } + to { -moz-transform: translateY(100%); } +} @-webkit-keyframes slideouttotop { from { -webkit-transform: translateY(0); } to { -webkit-transform: translateY(-100%); } } +@-moz-keyframes slideouttotop { + from { -moz-transform: translateY(0); } + to { -moz-transform: translateY(-100%); } +} @-webkit-keyframes fadein { from { opacity: 0; } to { opacity: 1; } } +@-moz-keyframes fadein { + from { opacity: 0; } + to { opacity: 1; } +} @-webkit-keyframes fadeout { from { opacity: 1; } to { opacity: 0; } } +@-moz-keyframes fadeout { + from { opacity: 1; } + to { opacity: 0; } +} .fade.in { opacity: 1; z-index: 10; -webkit-animation-name: fadein; + -moz-animation-name: fadein; } .fade.out { z-index: 0; -webkit-animation-name: fadeout; + -moz-animation-name: fadeout; } /* The properties in this rule are only necessary for the 'flip' transition. @@ -154,6 +227,7 @@ Built by David Kaneda and maintained by Jonathan Stark. */ .viewport-flip { -webkit-perspective: 1000; + -moz-perspective: 1000; position: absolute; } @@ -168,16 +242,23 @@ Built by David Kaneda and maintained by Jonathan Stark. -webkit-animation-duration: .65s; -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-animation-duration: .65s; + -moz-backface-visibility:hidden; + -moz-transform:translateX(0); } .flip.in { -webkit-transform: rotateY(0) scale(1); -webkit-animation-name: flipinfromleft; + -moz-transform: rotateY(0) scale(1); + -moz-animation-name: flipinfromleft; } .flip.out { -webkit-transform: rotateY(-180deg) scale(.8); -webkit-animation-name: flipouttoleft; + -moz-transform: rotateY(-180deg) scale(.8); + -moz-animation-name: flipouttoleft; } /* Shake it all about */ @@ -185,32 +266,52 @@ Built by David Kaneda and maintained by Jonathan Stark. .flip.in.reverse { -webkit-transform: rotateY(0) scale(1); -webkit-animation-name: flipinfromright; + -moz-transform: rotateY(0) scale(1); + -moz-animation-name: flipinfromright; } .flip.out.reverse { -webkit-transform: rotateY(180deg) scale(.8); -webkit-animation-name: flipouttoright; + -moz-transform: rotateY(180deg) scale(.8); + -moz-animation-name: flipouttoright; } @-webkit-keyframes flipinfromright { from { -webkit-transform: rotateY(-180deg) scale(.8); } to { -webkit-transform: rotateY(0) scale(1); } } +@-moz-keyframes flipinfromright { + from { -moz-transform: rotateY(-180deg) scale(.8); } + to { -moz-transform: rotateY(0) scale(1); } +} @-webkit-keyframes flipinfromleft { from { -webkit-transform: rotateY(180deg) scale(.8); } to { -webkit-transform: rotateY(0) scale(1); } } +@-moz-keyframes flipinfromleft { + from { -moz-transform: rotateY(180deg) scale(.8); } + to { -moz-transform: rotateY(0) scale(1); } +} @-webkit-keyframes flipouttoleft { from { -webkit-transform: rotateY(0) scale(1); } to { -webkit-transform: rotateY(-180deg) scale(.8); } } +@-moz-keyframes flipouttoleft { + from { -moz-transform: rotateY(0) scale(1); } + to { -moz-transform: rotateY(-180deg) scale(.8); } +} @-webkit-keyframes flipouttoright { from { -webkit-transform: rotateY(0) scale(1); } to { -webkit-transform: rotateY(180deg) scale(.8); } } +@-moz-keyframes flipouttoright { + from { -moz-transform: rotateY(0) scale(1); } + to { -moz-transform: rotateY(180deg) scale(.8); } +} /* Hackish, but reliable. */ @@ -219,28 +320,38 @@ Built by David Kaneda and maintained by Jonathan Stark. from { opacity: 1; } to { opacity: 1; } } +@-moz-keyframes dontmove { + from { opacity: 1; } + to { opacity: 1; } +} .pop { -webkit-transform-origin: 50% 50%; + -moz-transform-origin: 50% 50%; } .pop.in { -webkit-transform: scale(1); + -moz-transform: scale(1); opacity: 1; -webkit-animation-name: popin; + -moz-animation-name: popin; z-index: 10; } .pop.out.reverse { -webkit-transform: scale(.2); + -moz-transform: scale(.2); opacity: 0; -webkit-animation-name: popout; + -moz-animation-name: popout; z-index: 10; } .pop.in.reverse { z-index: 0; -webkit-animation-name: dontmove; + -moz-animation-name: dontmove; } @-webkit-keyframes popin { @@ -253,6 +364,16 @@ Built by David Kaneda and maintained by Jonathan Stark. opacity: 1; } } +@-moz-keyframes popin { + from { + -moz-transform: scale(.2); + opacity: 0; + } + to { + -moz-transform: scale(1); + opacity: 1; + } +} @-webkit-keyframes popout { from { @@ -263,4 +384,14 @@ Built by David Kaneda and maintained by Jonathan Stark. -webkit-transform: scale(.2); opacity: 0; } +} +@-moz-keyframes popout { + from { + -moz-transform: scale(1); + opacity: 1; + } + to { + -moz-transform: scale(.2); + opacity: 0; + } } \ No newline at end of file