FROM CACHE - de_header
Gelöst

html-Datei - Videos in Endlosschleife

Cramer
Besucher
1 0 0

Hallo,

kann man eine für sich eigene einfache html-Datei erstellen (ohne css und script...) und mehrere Videos (mp4) automatisch hintereinander in Endlosschleife auf dem eigenen Comp laufen lassen ?

Nicht auf einer I-Seite einbinden und nicht ins Netz stellen.

 

Eine eigene Startseite für Firefox hab ich mir ja zusammen gebastelt, aber hier bekomme ich nichts hin.

https://drive.google.com/file/d/1DwVABp5tjXqxFElLKWk01w3bPRVrwFws/view?usp=drive_link

https://drive.google.com/drive/folders/17SP0u589UKN2netYmHUxk9tBfN4H6xjZ?usp=drive_link

 

Ich hatte mal etwas ähnliches für mp3-Dateien, aber nach Comp.-Wechsel ist diese nicht mehr auffindbar und im Netz find ich einfach nichts.

 

Danke

Gruß

1 AKZEPTIERTE LÖSUNG
Gabe
Shopify Staff
16681 2637 3914

Erfolg.

Glaube nicht aber wo ein Wille da auch ein Weg, wie man so schön sagt! 😉

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

Lösung in ursprünglichem Beitrag anzeigen

3 ANTWORTEN 3

Gabe
Shopify Staff
16681 2637 3914

Hey @Cramer 

 

Meinst du so wie in diesem Shop Beispiel? Es ist definitiv möglich, eine einfache HTML-Datei zu erstellen, die mehrere MP4-Videos automatisch hintereinander in einer Endlosschleife abspielt. Dazu benötigst du keine CSS-Styles oder JavaScript, es sei denn, du möchtest zusätzliche Funktionalitäten oder Styles hinzufügen. Hier ein Beispiel, wie der HTML-Code aussehen könnte:

 

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Video Loop</title>
</head>
<body>

<video id="videoPlayer" width="320" height="240" controls>
  <source src="meinErstesVideo.mp4" type="video/mp4">
  Ihr Browser unterstützt das Video-Tag nicht.
</video>

<script>
// Liste deiner Videos
var videos = [
  "meinErstesVideo.mp4",
  "meinZweitesVideo.mp4",
  "meinDrittesVideo.mp4"
  // Füge hier weitere Videos hinzu
];

// Aktueller Index des Videos
var videoIndex = 0;

var player = document.getElementById('videoPlayer');

player.addEventListener('ended', function() {
  videoIndex++; // Zum nächsten Video wechseln
  if (videoIndex >= videos.length) {
    videoIndex = 0; // Zurück zum ersten Video
  }
  player.src=videos[videoIndex]; // Videoquelle ändern
  player.play(); // Video abspielen
}, false);

// Automatisches Abspielen des ersten Videos beim Laden der Seite
player.play();
</script>

</body>
</html>

 

  • Der <video>-Tag ist das HTML-Element, das zum Einbetten von Videodateien verwendet wird. Der controls-Attribut ist optional und fügt die Standardsteuerelemente für Wiedergabe, Pause usw. hinzu.
  • Die videos-Array enthält die Pfade zu deinen Videodateien. Diese Pfade müssen relativ zu der Position der HTML-Datei sein, wenn sie lokal abgespielt werden.
  • Das ended-Event des Video-Players wird ausgelöst, wenn ein Video zu Ende ist. Der Event-Listener, den wir hinzugefügt haben, wechselt dann zum nächsten Video in der Liste.
  • Wenn das letzte Video in der Liste beendet ist, fängt die Wiedergabe wieder vom ersten Video an (videoIndex = 0), was die Endlosschleife erstellt.
  • Das Skript setzt das Video automatisch in Gang, sobald die Seite geladen wird.

Du musst nur die Pfade deiner Videos in das Array videos eintragen und sicherstellen, dass alle Videodateien im selben Verzeichnis wie deine HTML-Datei gespeichert sind. Dann kannst du diese HTML-Datei in jedem modernen Webbrowser wie Firefox öffnen, und die Videos sollten automatisch abgespielt werden.

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

UweCramer
Besucher
1 0 1

hallo, danke für die schnelle Antwort.

Das Abspielen der Videos nacheinander klappt super, analog einer  *.m3u, auch der Wechsel zum Anfang zurück nach Abspielen des letzten Videos klappt supi.

 

Nur der automatische Start nach Aufrufen des Players geht nicht, muss ihn erst einmal starten UweCramer_0-1699453700507.png, aber das ist nicht so schlimm, Hauptsache wenn man wieder einmal etwas 'nachdenklich‘ ist, kann man 2-3 Titel immer wieder von vorn hören, danke dafür.

 

Eine Frage noch, man kann nur diesen Player in einem Tab damit starten, ihn ersetzt z.B. durch VLC-Payer geht nicht ?

Gruß

Gabe
Shopify Staff
16681 2637 3914

Erfolg.

Glaube nicht aber wo ein Wille da auch ein Weg, wie man so schön sagt! 😉

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog