Преглед на файлове

add convex background transition

Hakim El Hattab преди 11 години
родител
ревизия
d4e6fa12bf
променени са 2 файла, в които са добавени 45 реда и са изтрити 0 реда
  1. 45 0
      css/reveal.css
  2. 0 0
      css/reveal.min.css

+ 45 - 0
css/reveal.css

@@ -1268,6 +1268,11 @@ body {
 	position: absolute;
 	width: 100%;
 	height: 100%;
+
+	-webkit-perspective: 600px;
+	   -moz-perspective: 600px;
+	    -ms-perspective: 600px;
+	        perspective: 600px;
 }
 	.reveal .slide-background {
 		position: absolute;
@@ -1358,6 +1363,46 @@ body {
 	}
 
 
+/* Curve sliding transition style */
+.reveal[data-background-transition=convex]>.backgrounds .slide-background.past,
+.reveal>.backgrounds .slide-background.past[data-background-transition=convex] {
+	opacity: 0;
+
+	-webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0);
+	   -moz-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0);
+	    -ms-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0);
+	        transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0);
+}
+.reveal[data-background-transition=convex]>.backgrounds .slide-background.future,
+.reveal>.backgrounds .slide-background.future[data-background-transition=convex] {
+	opacity: 0;
+
+	-webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0);
+	   -moz-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0);
+	    -ms-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0);
+	        transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0);
+}
+
+.reveal[data-background-transition=convex]>.backgrounds .slide-background>.slide-background.past,
+.reveal>.backgrounds .slide-background>.slide-background.past[data-background-transition=convex] {
+	opacity: 0;
+
+	-webkit-transform: translate3d(0, -300px, 0) rotateX(90deg) translate3d(0, -300px, 0);
+	   -moz-transform: translate3d(0, -300px, 0) rotateX(90deg) translate3d(0, -300px, 0);
+	    -ms-transform: translate3d(0, -300px, 0) rotateX(90deg) translate3d(0, -300px, 0);
+	        transform: translate3d(0, -300px, 0) rotateX(90deg) translate3d(0, -300px, 0);
+}
+.reveal[data-background-transition=convex]>.backgrounds .slide-background>.slide-background.future,
+.reveal>.backgrounds .slide-background>.slide-background.future[data-background-transition=convex] {
+	opacity: 0;
+
+	-webkit-transform: translate3d(0, 300px, 0) rotateX(-90deg) translate3d(0, 300px, 0);
+	   -moz-transform: translate3d(0, 300px, 0) rotateX(-90deg) translate3d(0, 300px, 0);
+	    -ms-transform: translate3d(0, 300px, 0) rotateX(-90deg) translate3d(0, 300px, 0);
+	        transform: translate3d(0, 300px, 0) rotateX(-90deg) translate3d(0, 300px, 0);
+}
+
+
 /* Global transition speed settings */
 .reveal[data-transition-speed="fast"]>.backgrounds .slide-background {
 	-webkit-transition-duration: 400ms;

Файловите разлики са ограничени, защото са твърде много
+ 0 - 0
css/reveal.min.css


Някои файлове не бяха показани, защото твърде много файлове са промени