Explorar el Código

prevent iframes from offsetting presentation

Hakim El Hattab hace 10 años
padre
commit
a4852c7cb2
Se han modificado 3 ficheros con 25 adiciones y 0 borrados
  1. 1 0
      css/reveal.css
  2. 1 0
      css/reveal.scss
  3. 23 0
      js/reveal.js

+ 1 - 0
css/reveal.css

@@ -275,6 +275,7 @@ body {
   position: relative;
   width: 100%;
   height: 100%;
+  overflow: hidden;
   -ms-touch-action: none;
       touch-action: none; }
 

+ 1 - 0
css/reveal.scss

@@ -352,6 +352,7 @@ body {
 	position: relative;
 	width: 100%;
 	height: 100%;
+	overflow: hidden;
 	touch-action: none;
 }
 

+ 23 - 0
js/reveal.js

@@ -384,6 +384,9 @@
 		// Listen to messages posted to this window
 		setupPostMessage();
 
+		// Prevent iframes from scrolling the slides out of view
+		setupIframeScrollPrevention();
+
 		// Resets all vertical slides so that only the first is visible
 		resetVerticalSlides();
 
@@ -567,6 +570,26 @@
 
 	}
 
+	/**
+	 * This is an unfortunate necessity. Iframes can trigger the
+	 * parent window to scroll, for example by focusing an input.
+	 * This scrolling can not be prevented by hiding overflow in
+	 * CSS so we have to resort to repeatedly checking if the
+	 * browser has decided to offset our slides :(
+	 */
+	function setupIframeScrollPrevention() {
+
+		if( dom.slides.querySelector( 'iframe' ) ) {
+			setInterval( function() {
+				if( dom.wrapper.scrollTop !== 0 || dom.wrapper.scrollLeft !== 0 ) {
+					dom.wrapper.scrollTop = 0;
+					dom.wrapper.scrollLeft = 0;
+				}
+			}, 500 );
+		}
+
+	}
+
 	/**
 	 * Creates an HTML element and returns a reference to it.
 	 * If the element already exists the existing instance will