diff --git a/README.md b/README.md index 31dc903f21399de543dc999a3887ed4b1f79c261..c83e4067474d43ae3b045b15cbe0b7d689e3b2dd 100644 --- a/README.md +++ b/README.md @@ -431,8 +431,8 @@ Slides are contained within a limited portion of the screen by default to allow <section data-background="http://example.com/image.png" data-background-size="100px" data-background-repeat="repeat"> <h2>This background image will be sized to 100px and repeated.</h2> </section> -<section data-background-video="https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.mp4,https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.webm"> - <h2>Video. Multiple sources can be defined using a comma separated list.</h2> +<section data-background-video="https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.mp4,https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.webm" data-background-video-loop> + <h2>Video. Multiple sources can be defined using a comma separated list. Video will loop when the data-background-video-loop attribute is provided.</h2> </section> <section data-background-iframe="https://slides.com"> <h2>Embeds a web page as a background. Note that the page won't be interactive.</h2> diff --git a/js/reveal.js b/js/reveal.js index d5294e6f2fbab668e3ad492451d22320e65581e8..7d3973e274ef119f90297f33fe1865e56e7fa023 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -2756,6 +2756,7 @@ var backgroundImage = slide.getAttribute( 'data-background-image' ), backgroundVideo = slide.getAttribute( 'data-background-video' ), + backgroundVideoLoop = slide.hasAttribute( 'data-background-video-loop' ), backgroundIframe = slide.getAttribute( 'data-background-iframe' ); // Images @@ -2765,6 +2766,9 @@ // Videos else if ( backgroundVideo && !isSpeakerNotes() ) { var video = document.createElement( 'video' ); + if ( backgroundVideoLoop ) { + video.setAttribute( 'loop', '' ); + } // Support comma separated lists of video sources backgroundVideo.split( ',' ).forEach( function( source ) {