prevent invisible fragments from capturing mouse events #845

1 files changed, 11 insertions, 8 deletions

diff --git a/css/reveal.css b/css/reveal.css
index 3c38850..7423e18 100644
--- a/css/reveal.css
+++ b/css/reveal.css
@@ -96,6 +96,7 @@ body {
 
 .reveal .slides section .fragment {
 	opacity: 0;
+	visibility: hidden;
 
 	-webkit-transition: all .2s ease;
 	   -moz-transition: all .2s ease;
@@ -103,10 +104,12 @@ body {
 }
 	.reveal .slides section .fragment.visible {
 		opacity: 1;
+		visibility: visible;
 	}
 
 .reveal .slides section .fragment.grow {
 	opacity: 1;
+	visibility: visible;
 }
 	.reveal .slides section .fragment.grow.visible {
 		-webkit-transform: scale( 1.3 );
@@ -118,6 +121,7 @@ body {
 
 .reveal .slides section .fragment.shrink {
 	opacity: 1;
+	visibility: visible;
 }
 	.reveal .slides section .fragment.shrink.visible {
 		-webkit-transform: scale( 0.7 );
@@ -128,8 +132,6 @@ body {
 	}
 
 .reveal .slides section .fragment.zoom-in {
-	opacity: 0;
-
 	-webkit-transform: scale( 0.1 );
 	   -moz-transform: scale( 0.1 );
 	    -ms-transform: scale( 0.1 );
@@ -138,8 +140,6 @@ body {
 }
 
 	.reveal .slides section .fragment.zoom-in.visible {
-		opacity: 1;
-
 		-webkit-transform: scale( 1 );
 		   -moz-transform: scale( 1 );
 		    -ms-transform: scale( 1 );
@@ -148,8 +148,6 @@ body {
 	}
 
 .reveal .slides section .fragment.roll-in {
-	opacity: 0;
-
 	-webkit-transform: rotateX( 90deg );
 	   -moz-transform: rotateX( 90deg );
 	    -ms-transform: rotateX( 90deg );
@@ -157,8 +155,6 @@ body {
 	        transform: rotateX( 90deg );
 }
 	.reveal .slides section .fragment.roll-in.visible {
-		opacity: 1;
-
 		-webkit-transform: rotateX( 0 );
 		   -moz-transform: rotateX( 0 );
 		    -ms-transform: rotateX( 0 );
@@ -168,23 +164,29 @@ body {
 
 .reveal .slides section .fragment.fade-out {
 	opacity: 1;
+	visibility: visible;
 }
 	.reveal .slides section .fragment.fade-out.visible {
 		opacity: 0;
+		visibility: hidden;
 	}
 
 .reveal .slides section .fragment.semi-fade-out {
 	opacity: 1;
+	visibility: visible;
 }
 	.reveal .slides section .fragment.semi-fade-out.visible {
 		opacity: 0.5;
+		visibility: visible;
 	}
 
 .reveal .slides section .fragment.current-visible {
 	opacity: 0;
+	visibility: hidden;
 }
 	.reveal .slides section .fragment.current-visible.current-fragment {
 		opacity: 1;
+		visibility: visible;
 	}
 
 .reveal .slides section .fragment.highlight-red,
@@ -194,6 +196,7 @@ body {
 .reveal .slides section .fragment.highlight-blue,
 .reveal .slides section .fragment.highlight-current-blue {
 	opacity: 1;
+	visibility: visible;
 }
 	.reveal .slides section .fragment.highlight-red.visible {
 		color: #ff2c2d