diff options
| -rw-r--r-- | js/reveal.js | 67 |
1 files changed, 30 insertions, 37 deletions
diff --git a/js/reveal.js b/js/reveal.js index f50994f..d3ba03c 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -3061,6 +3061,13 @@ * * @param {HTMLElement} slide Slide to show */ + /** + * Called when the given slide is within the configured view + * distance. Shows the slide element and loads any content + * that is set to load lazily (data-src). + * + * @param {HTMLElement} slide Slide to show + */ function showSlide( slide ) { // Show the slide element @@ -3098,6 +3105,7 @@ // If the background contains media, load it if( background.hasAttribute( 'data-loaded' ) === false ) { + background.setAttribute( 'data-loaded', 'true' ); var backgroundImage = slide.getAttribute( 'data-background-image' ), backgroundVideo = slide.getAttribute( 'data-background-video' ), @@ -3107,43 +3115,38 @@ // Images if( backgroundImage ) { - background.style.backgroundImage = 'url('+ backgroundImage +')'; - background.setAttribute( 'data-loaded', 'true' ); - } // Videos else if ( backgroundVideo && !isSpeakerNotes() ) { + var video = document.createElement( 'video' ); - if( !isOverview() ) { - - var video = document.createElement( 'video' ); - video.setAttribute( 'autoplay', '' ); - video.setAttribute( 'playsinline', '' ); - - if( backgroundVideoLoop ) { - video.setAttribute( 'loop', '' ); - } - - if( backgroundVideoMuted ) { - video.muted = true; - } - - // Support comma separated lists of video sources - backgroundVideo.split( ',' ).forEach( function( source ) { - video.innerHTML += '<source src="'+ source +'">'; - } ); - - background.appendChild( video ); + if( backgroundVideoLoop ) { + video.setAttribute( 'loop', '' ); + } - background.setAttribute( 'data-loaded', 'true' ); + if( backgroundVideoMuted ) { + video.muted = true; + } + // Inline video playback works (at least in Mobile Safari) as + // long as the video is muted and the `playsinline` attribute is + // present + if( isMobileDevice ) { + video.muted = true; + video.autoplay = true; + video.setAttribute( 'playsinline', '' ); } + // Support comma separated lists of video sources + backgroundVideo.split( ',' ).forEach( function( source ) { + video.innerHTML += '<source src="'+ source +'">'; + } ); + + background.appendChild( video ); } // Iframes else if( backgroundIframe ) { - var iframe = document.createElement( 'iframe' ); iframe.setAttribute( 'allowfullscreen', '' ); iframe.setAttribute( 'mozallowfullscreen', '' ); @@ -3164,17 +3167,9 @@ iframe.style.maxWidth = '100%'; background.appendChild( iframe ); - - background.setAttribute( 'data-loaded', 'true' ); - } - else { - - background.setAttribute( 'data-loaded', 'true' ); - - } - } + } } @@ -3415,10 +3410,8 @@ * the targeted slide. * * @param {HTMLElement} element - * @param {boolean} autoplay Optionally override the - * autoplay setting of media elements */ - function stopEmbeddedContent( element, autoplay ) { + function stopEmbeddedContent( element ) { if( element && element.parentNode ) { // HTML5 media elements |