fbievan
/
Website-Redesign
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add play button to jumbotron if video is not playing

This commit is contained in:
Gabriele Musco 2021-07-07 15:33:41 +02:00
parent 9f0fd3337b
commit f1ef2f812b
No known key found for this signature in database
GPG Key ID: 8539FD3454380B83
1 changed files with 23 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
layouts/partials/jumbotron.html
View File

@ -9,6 +9,7 @@
<div class="video_container"> <div class="video_container">
<video <video
class="jumbotron_video" class="jumbotron_video"
id="jumbotron_video"
src="{{ .Site.Data.jumbotron.backgroundVideo }}" src="{{ .Site.Data.jumbotron.backgroundVideo }}"
autoplay mute loop> autoplay mute loop>
</video> </video>
@ -25,6 +26,28 @@
{{ end }} {{ end }}
">{{ .Site.Data.jumbotron.title }}</h1> ">{{ .Site.Data.jumbotron.title }}</h1>
<h2>{{ .Site.Data.jumbotron.subtitle }}</h2> <h2>{{ .Site.Data.jumbotron.subtitle }}</h2>
{{ if .Site.Data.jumbotron.backgroundVideo }}
<ul id="play_button_container" style="display: none">
<li>
<a title="Play" style="border-radius: 100%; width: 32px; height: 32px; display: flex; justify-content: center; align-items: center;" class="shareBtn" onclick="playvideo();"></a>
</li>
</ul>
<script>
var jumbotron_video = document.getElementById('jumbotron_video');
var play_button_container = document.getElementById('play_button_container');
window.onload = function() {
setTimeout(function() {
if (jumbotron_video.paused) {
play_button_container.style.display = 'block';
}
}, 1000);
};
function playvideo() {
jumbotron_video.play();
play_button_container.style.display = 'none';
}
</script>
{{ end }}
{{ if .Site.Data.jumbotron.links }} {{ if .Site.Data.jumbotron.links }}
<ul> <ul>
{{ range .Site.Data.jumbotron.links }} {{ range .Site.Data.jumbotron.links }}