Videos mit JavaScript abspielen
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
ausgehen
code
dauer
ersten videos
fertig abfragen
hohe bandbreite
http
kommunikation
laden
ladezeit
methode
objekt
parameter
programmcode
starten
tip
url
versuch
video
zeitspanne
-
Ich möchte einige Videos hintereinander anzeigen lassen.
Dafür habe ich die Dauer jedes Videos in Sekunden gespeichert.
Nun finde ich jedoch keinen Weg damit die Videos auch anständig nacheinander abgespielt werden.
Beim Versuch Nr 1 werden alle Videos nach der Dauer des ersten Videos unterbrochen.
Beim Versuch Nr 2 wird nur ein Video abgespielt.
Hat jemand nen Vorschlag wie ich das anständig Lösen kann?
Lösungsversuch mit setInterval
Lösungsversuch mit setTimeout()<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> </head> <body> <div id="mplayer">Musikplayer Laden..</div> <script type="text/javascript"> var Autor = new Array; var Titel = new Array; var Laenge = new Array; var Lied = new Array; var n = 0; var i = 0; Autor[n] = "AlexiBexi"; Titel[n] = "Teenage Dream - Auf Deutsch!"; Laenge[n] = 230; Lied[n] = "a1d5Z_9DTcQ"; n++; Autor[n] = "93Persian93"; Titel[n] = "Fard - Hilf dir Selber"; Laenge[n] = 211; Lied[n] = "q0TCyyvYZ2M"; n++; Autor[n] = "AlexiBexi"; Titel[n] = "Love The Way You Lie - Auf Deutsch!"; Laenge[n] = 265; Lied[n] = "jp3xf-nfuVM"; n++; Autor[n] = "JAMBAberlin"; Titel[n] = "Schnuffelienchen - Küss mich, halt mich, lieb mich"; Laenge[n] = 219; Lied[n] = "s9NVF4QkIJY"; n++; Autor[n] = "meganwhite1995"; Titel[n] = "Dj Boonie - Why Do i Love You?"; Laenge[n] = 155; Lied[n] = "xtwZ0SQiAro";n++; Autor[n] = "TightaSupporter"; Titel[n] = "Tight A feat. Faze - Mein Mädchen"; Laenge[n] = 180; Lied[n] = "DruVpWvGvkc"; n++; Autor[n] = "alyssadhaliwal"; Titel[n] = "Adam Lambert - Sleepwalker acoustic"; Laenge[n] = 255; Lied[n] = "NDlQkymHK48"; n++; Autor[n] = ""; Titel[n] = ""; Laenge[n] = 0; Lied[n] = ""; n++; var Dauer = (Laenge[i] + 3) * 1000; var aktiv = window.setInterval("Mplayer()", Dauer); document.title = 'Amity | Community • ' + Autor[i] + ' ~ ' + Titel[i]; document.getElementById('mplayer').innerHTML = '<object type="application/x-shockwave-flash" style="width: 100%; height: 100%" data="http://www.youtube.com/v/' + Lied[i] + '&hl=de&fs=1&rel=0&hd=1&autoplay=1&ap=%2526fmt%3D18&ap=%2526fmt%3D22&showinfo=0"> <param name="movie" value="http://www.youtube.com/v/' + Lied[i] + '&hl=de&fs=1&rel=0&hd=1&autoplay=1&ap=%2526fmt%3D18&ap=%2526fmt%3D22&showinfo=0" /> <param name="allowfullscreen" value="true" /> </object>'; i = i + 1; function Mplayer() { document.title = 'Amity | Community • ' + Autor[i] + ' ~ ' + Titel[i]; document.getElementById('mplayer').innerHTML = '<object type="application/x-shockwave-flash" style="width: 100%; height: 100%" data="http://www.youtube.com/v/' + Lied[i] + '&hl=de&fs=1&rel=0&hd=1&autoplay=1&ap=%2526fmt%3D18&ap=%2526fmt%3D22&showinfo=0"> <param name="movie" value="http://www.youtube.com/v/' + Lied[i] + '&hl=de&fs=1&rel=0&hd=1&autoplay=1&ap=%2526fmt%3D18&ap=%2526fmt%3D22&showinfo=0" /> <param name="allowfullscreen" value="true" /> </object>'; i = i + 1; if (i >= n) { window.clearInterval(aktiv); } } </script> </body> </html><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> </head> <body> <div id="mplayer">Musikplayer Laden..</div> <script type="text/javascript"> var Autor = new Array; var Titel = new Array; var Laenge = new Array; var Lied = new Array; var n = 0; var s = 0; Autor[n] = "AlexiBexi"; Titel[n] = "Teenage Dream - Auf Deutsch!"; Laenge[n] = 230; Lied[n] = "a1d5Z_9DTcQ"; n++; Autor[n] = "93Persian93"; Titel[n] = "Fard - Hilf dir Selber"; Laenge[n] = 211; Lied[n] = "q0TCyyvYZ2M"; n++; Autor[n] = "AlexiBexi"; Titel[n] = "Love The Way You Lie - Auf Deutsch!"; Laenge[n] = 265; Lied[n] = "jp3xf-nfuVM"; n++; Autor[n] = "JAMBAberlin"; Titel[n] = "Schnuffelienchen - Küss mich, halt mich, lieb mich"; Laenge[n] = 219; Lied[n] = "s9NVF4QkIJY"; n++; Autor[n] = "meganwhite1995"; Titel[n] = "Dj Boonie - Why Do i Love You?"; Laenge[n] = 155; Lied[n] = "xtwZ0SQiAro";n++; Autor[n] = "TightaSupporter"; Titel[n] = "Tight A feat. Faze - Mein Mädchen"; Laenge[n] = 180; Lied[n] = "DruVpWvGvkc"; n++; Autor[n] = "alyssadhaliwal"; Titel[n] = "Adam Lambert - Sleepwalker acoustic"; Laenge[n] = 255; Lied[n] = "NDlQkymHK48"; n++; Autor[n] = ""; Titel[n] = ""; Laenge[n] = 0; Lied[n] = ""; n++; for(i = 0; i < n; s++) { var Dauer = (Laenge[i] + 3) * 1000; document.title = 'Amity | Community • ' + Autor[i] + ' ~ ' + Titel[i]; document.getElementById('mplayer').innerHTML = '<object type="application/x-shockwave-flash" style="width: 100%; height: 100%" data="http://www.youtube.com/v/' + Lied[i] + '&hl=de&fs=1&rel=0&hd=1&autoplay=1&ap=%2526fmt%3D18&ap=%2526fmt%3D22&showinfo=0"> <param name="movie" value="http://www.youtube.com/v/' + Lied[i] + '&hl=de&fs=1&rel=0&hd=1&autoplay=1&ap=%2526fmt%3D18&ap=%2526fmt%3D22&showinfo=0" /> <param name="allowfullscreen" value="true" /> </object>'; setTimeout(i = i + 1, Dauer); } </script> </body> </html> -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Deine Fehler sind klein, aber fatal:
Die Zeitspanne, die du setInverval() mitgibst, ist konstant, und kann nur geändert werden, indem das Invervall mit clearInverval() unterbrochen und dann mit einem neuen Wert wieder gestartet wird.
setTimeout() unterbicht nicht den Programmablauf, sondern führt den Befehl bzw. Code, den man der Methode übergibt verzögert aus. Alles was nach setInverval() steht, wird ohne Verzögerung ausgeführt.
Im Prinzip starten beide Methoden einen Thread, der dann parallel zum übrigen Programmcode ausgeführt wird.
Noch ein Problem, das du nicht berücksichtigt hast, ist die Ladezeit der Videos. Du kannst nicht davon ausgehen, dass jeder Besucher eine so hohe Bandbreite wie du hat und das Video sofort starten kann. Insbesondere Nutzer mobiler Internetzugänge haben - bei schlechtem Empfang - mit sehr langen Ladezeiten zu kämpfen.
Für deinen Fall im speziellen würde ich die Variante mit setTimeout() wählen. Du musst lediglich die Methode Mplayer() - wie bei deiner ersten Variante - als Parameter mitgeben, und das Invervall für jedes Video mit der betreffenden Zeit starten, da sich die Intervallzeit nicht ändern lässt, wenn das Invervall schon läuft.
Ich muss sagen, ich kenne mich mit Flash nicht wirklich aus, glaube aber, mal gelesen zu haben, dass zwischen Flash und JS eine Kommunikation, ähnlich wie bei JS und Java-Applets, möglich ist. Wenn das stimmt, könnte man theoretisch die Zeit, die das Video noch läuft und/oder den Zustand (lädt, spielt, fertig) abfragen, und den Videowechsel darauf aufbauen.
Wäre ein Fall für Google oder den Flashbereich im Lima-Forum.
Noch 2 Tipps zu deinem Code:
-->
kann man alsi = i + 1;
oder gleich alsi += 1;
verkürzen.i++;
--> innerHTML gehört nicht zum offizellen Standard. Der Zugriff auf das DOM über nodes wäre sauberer. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
