|
|
@@ -17,19 +17,27 @@ section {
|
|
|
top: 0px;
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
+ z-index: 0;
|
|
|
+
|
|
|
+ display: block;
|
|
|
+ visibility: hidden;
|
|
|
+ -webkit-backface-visibility: hidden;
|
|
|
|
|
|
- display: none;
|
|
|
- -webkit-backface-visibility: hidden;
|
|
|
-
|
|
|
&:first-child, &.show {
|
|
|
- display: block;
|
|
|
- .transform(translate3d(0%, 0, 0));
|
|
|
+ z-index: 1;
|
|
|
+ //display: block;
|
|
|
+ visibility: visible;
|
|
|
+ }
|
|
|
+ &.hide {
|
|
|
+ z-index: 0;
|
|
|
+ //display: none;
|
|
|
+ visibility: hidden;
|
|
|
}
|
|
|
- &.hide { display: none; }
|
|
|
|
|
|
&.slide {
|
|
|
- .transform(translate3d(100%, 0, 0));
|
|
|
- display: block;
|
|
|
+ .transform(translate(100%, 0));
|
|
|
+ //display: block;
|
|
|
+ visibility: visible !important;
|
|
|
|
|
|
-webkit-transition: -webkit-transform 250ms @defaultTrasition;
|
|
|
/*
|
|
|
@@ -38,30 +46,22 @@ section {
|
|
|
transition: @keyframe @defaultTrasition;
|
|
|
*/
|
|
|
|
|
|
- &:first-child, &.show {
|
|
|
- .transform(translate3d(0%, 0, 0));
|
|
|
- }
|
|
|
- &.hide {
|
|
|
- .transform(translate3d(-100%, 0, 0));
|
|
|
- }
|
|
|
+ &:first-child, &.show { .transform(translate(0%, 0)); }
|
|
|
+ &.hide { .transform(translate(-100%, 0)); }
|
|
|
}
|
|
|
|
|
|
|
|
|
&.pop {
|
|
|
- z-index: 0;
|
|
|
opacity: 0;
|
|
|
- display: block;
|
|
|
-webkit-transition: all 250ms @defaultTrasition;
|
|
|
- .transform(scale(1.2));
|
|
|
+ .transform(scale(1.15));
|
|
|
|
|
|
&:first-child, &.show {
|
|
|
- z-index: 1;
|
|
|
.transform(scale(1));
|
|
|
opacity: 1;
|
|
|
}
|
|
|
&.hide {
|
|
|
- z-index: 0;
|
|
|
- .transform(scale(0.8));
|
|
|
+ .transform(scale(0.9));
|
|
|
opacity: 0;
|
|
|
}
|
|
|
}
|