Ich versuche, ein Video zu laden und dann das Video basierend auf dem Scrollen des Fensters abzuspielen. Was ich bisher in Safari und Firefox aber nicht in Chrome gearbeitet habe. Der Fehler, den ich in Chrome bekomme, ist: Uncaught InvalidStateError: Fehler beim Festlegen der Eigenschaft 'currentTime' für 'HTMLMediaElement': Der readyState des Elements lautet HAVE_NOTHING.
Weiß jemand, was ich falsch mache?
%Vor% Dieser Fehler wird immer dann ausgelöst, wenn Sie currentTime festlegen, bevor der Browser die duration des Videos kennt. Die Dauer ist Teil der "Metadaten", die sich normalerweise in der Kopfzeile der Videodatei befinden und die Höhe und Breite umfassen.
Wenn Sie ein Videoelement ohne das Attribut preload haben, versucht der Browser normalerweise, die Metadaten bald nach dem Laden der Seite zu laden. Aber abhängig von den Besonderheiten des Browsers, dem Rest des Inhalts auf der Seite und der Geschwindigkeit der Netzwerkverbindung, kann es nicht passieren, bis Sie mindestens einmal gescrollt haben.
Eine Lösung sieht ungefähr so aus.
%Vor% Das sollte den Fehler verschwinden lassen. Wenn Sie dies versuchen und das loadedmetadata -Ereignis nie ausgelöst wird, versuchen Sie, dies am Ende hinzuzufügen, um es zu erzwingen:
Bearbeiten: Definiert und setzt scrollPosition . Hier ist ein funktionierendes Beispiel: Ссылка
Ich habe gerade einen Codepen gefunden, der ein bisschen schneller ist und fast dasselbe mit weniger Code macht: Ссылка
%Vor%Tags und Links javascript jquery google-chrome html5-video