Browse Source

fall back on js centering when flexbox is not supported

Hakim El Hattab 11 years ago
parent
commit
939af263ce
4 changed files with 23 additions and 24 deletions
  1. 6 9
      css/reveal.css
  2. 0 0
      css/reveal.min.css
  3. 16 14
      js/reveal.js
  4. 1 1
      js/reveal.min.js

+ 6 - 9
css/reveal.css

@@ -624,8 +624,12 @@ body {
 	display: block;
 }
 
-.reveal.center .slides section:not(.stack),
-.reveal.center .slides section>section {
+.reveal.center .slides,
+.reveal.center .slides section {
+	height: 100%;
+}
+
+.reveal.center .slides section:not(.stack) {
 	display: -webkit-box;
 	display: -webkit-flex;
 	display: -moz-box;
@@ -684,12 +688,6 @@ body {
 	opacity: 1;
 }
 
-.reveal.center,
-.reveal.center .slides,
-.reveal.center .slides section {
-	height: 100%;
-}
-
 /* Don't allow interaction with invisible slides */
 .reveal .slides>section.future,
 .reveal .slides>section>section.future,
@@ -1172,7 +1170,6 @@ body {
 }
 
 .reveal.overview .slides section {
-	height: 600px;
 	overflow: hidden;
 	opacity: 1 !important;
 	visibility: visible !important;

File diff suppressed because it is too large
+ 0 - 0
css/reveal.min.css


+ 16 - 14
js/reveal.js

@@ -1129,27 +1129,29 @@ var Reveal = (function(){
 
 			for( var i = 0, len = slides.length; i < len; i++ ) {
 				var slide = slides[ i ];
+				var style = window.getComputedStyle( slide );
 
-				// Don't bother updating invisible slides
-				if( slide.style.display === 'none' ) {
+				// Don't update invisible slides
+				if( style.display === 'none' ) {
 					continue;
 				}
-
-				/*
-				if( config.center || slide.classList.contains( 'center' ) ) {
-					// Vertical stacks are not centred since their section
-					// children will be
-					if( slide.classList.contains( 'stack' ) ) {
-						slide.style.top = 0;
+				// If the display mode is 'block' flexbox is not supported by
+				// the current browser so we fall back on JavaScript centering
+				else if( style.display === 'block' ) {
+					if( config.center || slide.classList.contains( 'center' ) ) {
+						// Vertical stacks are not centred since their section children will be
+						if( slide.classList.contains( 'stack' ) ) {
+							slide.style.top = 0;
+						}
+						else {
+							slide.style.top = Math.max( ( ( slideHeight - getAbsoluteHeight( slide ) ) / 2 ) - slidePadding, 0 ) + 'px';
+							slide.style.height = 'auto';
+						}
 					}
 					else {
-						slide.style.top = Math.max( ( ( slideHeight - getAbsoluteHeight( slide ) ) / 2 ) - slidePadding, 0 ) + 'px';
+						slide.style.top = '';
 					}
 				}
-				else {
-					slide.style.top = '';
-				}
-				*/
 
 			}
 

File diff suppressed because it is too large
+ 1 - 1
js/reveal.min.js


Some files were not shown because too many files changed in this diff