bg videos remain muted on mobile, otherwise broken when navigating with swipe gestures

This commit is contained in:
Hakim El Hattab 2020-06-16 11:20:15 +02:00
parent 2fccb77405
commit 9ff27cfbc9
4 changed files with 9 additions and 4 deletions

2
dist/reveal.esm.js vendored

File diff suppressed because one or more lines are too long

2
dist/reveal.js vendored

File diff suppressed because one or more lines are too long

View File

@ -36,7 +36,7 @@
<video src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" data-autoplay></video> <video src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" data-autoplay></video>
</section> </section>
<section data-background-video="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" data-background-video-muted> <section data-background-video="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4">
<h2>Background Video</h2> <h2>Background Video</h2>
</section> </section>
@ -68,7 +68,7 @@
<script src="../dist/reveal.js"></script> <script src="../dist/reveal.js"></script>
<script> <script>
Reveal.initialize(); Reveal.initialize({hash: true});
</script> </script>
</body> </body>

View File

@ -117,7 +117,12 @@ export default class SlideContent {
} }
// Enable inline playback in mobile Safari // Enable inline playback in mobile Safari
//
// Mute is required for video to play when using
// swipe gestures to navigate since they don't
// count as direct user actions :'(
if( isMobile ) { if( isMobile ) {
video.muted = true;
video.setAttribute( 'playsinline', '' ); video.setAttribute( 'playsinline', '' );
} }