2012-01-09 09:13:44 +00:00
|
|
|
/* slide up */
|
|
|
|
|
.slideup.out {
|
|
|
|
|
-webkit-animation-name: fadeout;
|
|
|
|
|
-moz-animation-name: fadeout;
|
2012-01-17 04:41:37 +00:00
|
|
|
-webkit-animation-duration: 100ms;
|
|
|
|
|
-moz-animation-duration: 100ms;
|
2012-01-09 09:13:44 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.slideup.in {
|
|
|
|
|
-webkit-transform: translateY(0);
|
|
|
|
|
-webkit-animation-name: slideinfrombottom;
|
|
|
|
|
-moz-transform: translateY(0);
|
|
|
|
|
-moz-animation-name: slideinfrombottom;
|
2012-01-17 04:41:37 +00:00
|
|
|
-webkit-animation-duration: 250ms;
|
|
|
|
|
-moz-animation-duration: 250ms;
|
2012-01-09 09:13:44 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.slideup.in.reverse {
|
|
|
|
|
-webkit-animation-name: fadein;
|
|
|
|
|
-moz-animation-name: fadein;
|
2012-01-17 04:41:37 +00:00
|
|
|
-webkit-animation-duration: 150ms;
|
|
|
|
|
-moz-animation-duration: 150ms;
|
2012-01-09 09:13:44 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.slideup.out.reverse {
|
|
|
|
|
-webkit-transform: translateY(100%);
|
|
|
|
|
-moz-transform: translateY(100%);
|
|
|
|
|
-webkit-animation-name: slideouttobottom;
|
|
|
|
|
-moz-animation-name: slideouttobottom;
|
2012-01-17 04:41:37 +00:00
|
|
|
-webkit-animation-duration: 200ms;
|
|
|
|
|
-moz-animation-duration: 200ms;
|
2012-01-09 09:13:44 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@-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%); }
|
|
|
|
|
}
|