Hopiu/jquery-mobile
1
0
Fork 0
mirror of https://github.com/Hopiu/jquery-mobile.git synced 2026-03-16 22:10:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

added the timing durations to the transitions themselves

Browse source
This commit is contained in:
scottjehl 2012-01-12 21:41:39 +07:00
parent c97d708bec
commit d72397daa0
6 changed files with 25 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
css/structure/jquery.mobile.transitions.flip.css
View file

@ -20,13 +20,17 @@
.flip.out {
-webkit-transform: rotateY(-90deg) scale(.9);
-webkit-animation-name: flipouttoleft;
-webkit-animation-duration: 225ms;
-moz-transform: rotateY(-90deg) scale(.9);
-moz-animation-name: flipouttoleft;
-moz-animation-duration: 225ms;
}
.flip.in {
-webkit-animation-name: flipintoright;
-webkit-animation-duration: 350ms;
-moz-animation-name: flipintoright;
-moz-animation-duration: 350ms;
}
.flip.out.reverse {

4
css/structure/jquery.mobile.transitions.pop.css
View file

@ -9,12 +9,16 @@
opacity: 1;
-webkit-animation-name: popin;
-moz-animation-name: popin;
-webkit-animation-duration: 350ms;
-moz-animation-duration: 350ms;
}
.pop.out {
-webkit-animation-name: fadeout;
-moz-animation-name: fadeout;
opacity: 0;
-webkit-animation-duration: 225ms;
-moz-animation-duration: 225ms;
}
.pop.in.reverse {

4
css/structure/jquery.mobile.transitions.slide.css
View file

@ -4,6 +4,8 @@
-webkit-animation-name: slideouttoleft;
-moz-transform: translateX(-100%);
-moz-animation-name: slideouttoleft;
-webkit-animation-duration: 225ms;
-moz-animation-duration: 225ms;
}
.slide.in {
@ -11,6 +13,8 @@
-webkit-animation-name: fadein;
-moz-transform: translateX(0);
-moz-animation-name: fadein;
-webkit-animation-duration: 350ms;
-moz-animation-duration: 350ms;
}
.slide.out.reverse {

4
css/structure/jquery.mobile.transitions.slidedown.css
View file

@ -2,6 +2,8 @@
.slidedown.out {
-webkit-animation-name: fadeout;
-moz-animation-name: fadeout;
-webkit-animation-duration: 225ms;
-moz-animation-duration: 225ms;
}
.slidedown.in {
@ -9,6 +11,8 @@
-webkit-animation-name: slideinfromtop;
-moz-transform: translateY(0);
-moz-animation-name: slideinfromtop;
-webkit-animation-duration: 350ms;
-moz-animation-duration: 350ms;
}
.slidedown.in.reverse {

4
css/structure/jquery.mobile.transitions.slideup.css
View file

@ -2,6 +2,8 @@
.slideup.out {
-webkit-animation-name: fadeout;
-moz-animation-name: fadeout;
-webkit-animation-duration: 225ms;
-moz-animation-duration: 225ms;
}
.slideup.in {
@ -9,6 +11,8 @@
-webkit-animation-name: slideinfrombottom;
-moz-transform: translateY(0);
-moz-animation-name: slideinfrombottom;
-webkit-animation-duration: 350ms;
-moz-animation-duration: 350ms;
}
.slideup.in.reverse {

5
css/structure/jquery.mobile.transitions.turn.css
View file

@ -25,11 +25,16 @@
-webkit-animation-name: flipouttoleft;
-moz-transform: rotateY(-90deg) scale(.9);
-moz-animation-name: flipouttoleft;
-webkit-animation-duration: 225ms;
-moz-animation-duration: 225ms;
}
.turn.in {
-webkit-animation-name: flipintoright;
-moz-animation-name: flipintoright;
-webkit-animation-duration: 350ms;
-moz-animation-duration: 350ms;
}
.turn.out.reverse {