diff --git a/css/main.css b/css/main.css index 2a6b9dbe..2a590b73 100644 --- a/css/main.css +++ b/css/main.css @@ -872,3 +872,27 @@ html { } +/********************************************* + * FALLBACK + *********************************************/ + +.no-transforms { + overflow-y: auto; +} + +.no-transforms .slides section { + -webkit-transform: none; + -moz-transform: none; + -ms-transform: none; + transform: none; + + display: block!important; + opacity: 1!important; + position: relative!important; +} + + + + + + diff --git a/js/reveal.js b/js/reveal.js index aa5cc7d3..767c4b97 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -104,13 +104,26 @@ var Reveal = (function(){ supports3DTransforms = document.body.style['perspectiveProperty'] !== undefined || document.body.style['WebkitPerspective'] !== undefined || document.body.style['MozPerspective'] !== undefined || - document.body.style['msTransform'] !== undefined; + document.body.style['msPerspective'] !== undefined, + + supports2DTransforms = document.body.style['transformProperty'] !== undefined || + document.body.style['WebkitTransform'] !== undefined || + document.body.style['MozTransform'] !== undefined || + document.body.style['msTransform'] !== undefined || + document.body.style['OTransform'] !== undefined; /** * Starts up the slideshow by applying configuration * options and binding various events. */ function initialize( options ) { + + if( !supports2DTransforms && !supports3DTransforms ) { + document.body.setAttribute( 'class', 'no-transforms' ); + + return; + } + // Cache references to DOM elements dom.wrapper = document.querySelector( '#reveal' ); dom.progress = document.querySelector( '#reveal .progress' );