Archiv

JavaScript

Eigenes Interface für Videos und Audios mittels der JavaScript API der neuen Elemente programmieren

<!DOCTYPE html>
<video id="film" src="vido.mp4" width="50%">
<input type="button" value="Start/Sop" oncklick="start()">
<script>
var video=document.getElementById('film');
 var start = function(){
if(video.paused){
video.play();
}
else {video.pause();
}}
var stumm = function (){
if (video.stumm){
video.stumm =false;
}
else{video.stumm = true;
}
}
</script>

Als erstes wird ein Video mit dem Video Element und einige Eckdaten notiert.
Dann wird ein Start/Stop Button hinzugefügt. Auf dem Button mit dem Wert Start/Stop wird ein Onclick – Händler definiert.

< input type="button" value="Start/Stop" onclick="start()">

Jetzt wird noch die Funktion für diesen Button gebraucht.
Im Scriptblock wird die Variable Video gleichgesetzt mit document.getElementById – nehme das Element ins Dokument über die ID. Hiermit wird der Zugriff auf das Video geschaffen.

var video = document.getElementById('');
var start = function();

Nun muss noch die Play- und Pause – Funktion des Elementes aufgerufen werden

 video.play();
video.pause();

Jetzt muss nur noch abgefragt werden, ob das Video grade pausiert oder abspielt.

if(video.paused){
video.play();}
else{ 
video.pause();}

Wenn das video pausiert if (video.paused), dann spiele video.play as Video ab, wenn (es)nicht (abspielt) dann pausiere.
else{
video.pause();}

<!DOCTYPE html>
<p>
<video id="film" src="video.mp3" width="50%"></pre>
<input type="button" value="Start/Stop" onclick="start()">
<pre><input type="button" value="stumm schalten" oncklick="stumm()">
<script>
var video=document.getElementById('film');
 var start = function(){
if(video.paused){
video.play();
}
else {video.pause();
}}
var stumm = function (){
if (video.stumm){
video.stumm =false;
}
else{video.stumm = true;
}
}
</script>