test
This commit is contained in:
@@ -1,83 +0,0 @@
|
||||
<div class="video-controls">
|
||||
<div class="video-controls-inside">
|
||||
<div class="label">
|
||||
8 Bit music, Pumped Up Kicks | Centuries | All Star
|
||||
</div>
|
||||
<div class="controls">
|
||||
<ul>
|
||||
<li>
|
||||
<i id="mute"
|
||||
class="fa"
|
||||
onclick="toggleMute()"
|
||||
aria-hidden="true"></i>
|
||||
</li>
|
||||
<li>
|
||||
<i id="play"
|
||||
class="fa"
|
||||
onclick="togglePlay()"
|
||||
aria-hidden="true"></i>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
let playing = false;
|
||||
let muted = false;
|
||||
const video = document.getElementById( 'video' );
|
||||
const playBtn = document.getElementById( 'play' );
|
||||
const muteBtn = document.getElementById( 'mute' );
|
||||
|
||||
function play() {
|
||||
playing = true;
|
||||
video.play();
|
||||
playBtn.classList.add( 'fa-pause-circle-o' );
|
||||
playBtn.classList.remove( 'fa-play-circle-o' );
|
||||
}
|
||||
|
||||
function stop() {
|
||||
playing = false;
|
||||
video.pause();
|
||||
playBtn.classList.remove( 'fa-pause-circle-o' );
|
||||
playBtn.classList.add( 'fa-play-circle-o' );
|
||||
}
|
||||
|
||||
function mute() {
|
||||
muted = true;
|
||||
video.muted = true;
|
||||
muteBtn.classList.add( 'fa-volume-off' );
|
||||
muteBtn.classList.remove( 'fa-volume-up' );
|
||||
}
|
||||
|
||||
function unmute() {
|
||||
muted = false;
|
||||
video.muted = false;
|
||||
muteBtn.classList.remove( 'fa-volume-off' );
|
||||
muteBtn.classList.add( 'fa-volume-up' );
|
||||
}
|
||||
|
||||
function togglePlay() {
|
||||
if ( playing ) {
|
||||
stop();
|
||||
} else {
|
||||
play();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function toggleMute() {
|
||||
if ( muted ) {
|
||||
unmute();
|
||||
} else {
|
||||
mute();
|
||||
}
|
||||
}
|
||||
|
||||
setTimeout( () => {
|
||||
mute();
|
||||
play();
|
||||
}, 500 );
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user