nyanloutre/site-max
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Bouton plein écran

Browse Source
This commit is contained in:
nyanloutre 2017-07-20 13:37:09 +02:00
parent 989c159aa9
commit 9977ec89b7
Signed by: nyanloutre
GPG Key ID: F85D93686A3A9063
2 changed files with 23 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
index.html
View File

@ -70,7 +70,7 @@
<i class="fa fa-angle-down fa-2x" aria-hidden="true"></i> <i class="fa fa-angle-down fa-2x" aria-hidden="true"></i>
</a> </a>
<a id="video-sound" class="btn btn-default"> <a id="video-sound" class="btn btn-default" href="#">
<svg class="icone icone-son" aria-hidden="true"> <svg class="icone icone-son" aria-hidden="true">
<use xlink:href="/vector/sprite.svg#sound-off"></use> <use xlink:href="/vector/sprite.svg#sound-off"></use>
</svg> </svg>
@ -80,6 +80,10 @@
<i class="fa fa-youtube fa-2x" aria-hidden="true"></i> <i class="fa fa-youtube fa-2x" aria-hidden="true"></i>
</a> </a>
<a id="fullscreen-video" class="btn btn-default" href="#">
<i class="fa fa-arrows-alt fa-2x" aria-hidden="true"></i>
</a>
</header> </header>
<section class="bg-primary" id="about"> <section class="bg-primary" id="about">
@ -212,6 +216,7 @@
<script> <script>
var masthead_video = document.getElementById("masthead-video"); var masthead_video = document.getElementById("masthead-video");
var video_button = document.getElementById("video-sound"); var video_button = document.getElementById("video-sound");
var fullscreen_button = document.getElementById("fullscreen-video");
function masthead_video_mute(mute) { function masthead_video_mute(mute) {
player.setMute(mute); player.setMute(mute);
@ -238,6 +243,20 @@
player.play(); player.play();
} }
function fullscreen(video) {
if (video.requestFullscreen) {
video.requestFullscreen();
} else if (video.mozRequestFullScreen) {
video.mozRequestFullScreen();
} else if (video.webkitRequestFullscreen) {
video.webkitRequestFullscreen();
}
}
fullscreen_button.onclick = function () {
fullscreen(masthead_video);
};
var url = "video/1_Compilation_Graphique/1_Compilation_Graphique.mpd"; var url = "video/1_Compilation_Graphique/1_Compilation_Graphique.mpd";
var player = dashjs.MediaPlayer().create(); var player = dashjs.MediaPlayer().create();
player.getDebug().setLogToBrowserConsole(false); player.getDebug().setLogToBrowserConsole(false);

3
scss/_masthead.scss
View File

@ -49,6 +49,9 @@ header.masthead {
#youtube-link { #youtube-link {
right: 9rem; right: 9rem;
} }
#fullscreen-video {
left: 4rem;
}
@media (min-width: 768px) { @media (min-width: 768px) {
height: 100%; height: 100%;
.header-content { .header-content {