Safari Browser springt zur Anzeige von HTML5 Autoplay Video

Ich habe einen Feed von Instagram-Inhalten, die aktuelle Beiträge enthält. Wenn es sich bei dem Beitrag um ein Video handelt, wird dies wie folgt angezeigt: HTML5-Video mit automatischen Wiedergabe-, Loop- und stummgeschalteten Attributen.Safari Browser springt zur Anzeige von HTML5 Autoplay Video

Ästhetisch ist das Ergebnis sehr erfreulich; In Safari jedoch, wenn das Video vollständig geladen wurde, überspringt der Browser die Webseite an die Position des Videos. In Chrome funktioniert das nicht.

Das Video ist nicht der Hauptinhalt, also möchte ich nicht, dass es die Seite überspringt.

Fragen

Gibt es ein W3C-Standard für automatische Wiedergabe? D. h., Safari oder Chrom, die den Standardansatz verwenden
Was ist der beste Weg, um dies zu beheben?

Gedanken über soultion

ich runter ausschalten kann und stattdessen Spiel mit JS auslösen. Dies scheint jedoch ein wenig unnötig und schafft eine neue Abhängigkeit.

Quelle

2016-12-22 slawrence10

W3C scheint nicht zu sagen, wenn das Autoplay-Video sollte automatisch zu fokussieren bewegen, also nicht denke, es gibt ein Recht oder Unrecht. Meine Vorliebe würde sein, die Autoplay abzuziehen und einen Benutzer klicken, um jedes Video zu initiieren - bedeutet der Benutzer sieht immer das Video von Anfang an und kontrolliert die Bandbreitennutzung – Offbeatmammal

Danke @Offbeatmammal Ich bin mir der UX-Implikationen bewusst. Ärgerlich diese Safari scheint dies zu erzwingen. – slawrence10

Ich habe dasselbe Problem mit einer Website, an der ich gerade arbeite, entdeckt. Ich habe versucht, das Autoplay-Attribut zu entfernen und das Video auszulösen, das nach einer Zeitüberschreitung in JS abgespielt wird. Sobald das Video ausgelöst wird, springt Safari jedoch zurück zum Video. –

* Aktualisiert: Limit scroll Länge bis 1500 Einheiten bis 2 Sekunden nach der Videowiedergabe beginnt ...

<html> 
<head> 
    <script type="text/javascript"> 
    var scrollPosition = 0; 
    var videoLoaded = false; 
    function bodyOnScroll() { 
    // this 1500 value might need to be tweaked less or more depending 
    // on how far the scroll to your video is 
    if(Math.abs(document.body.scrollTop - scrollPosition) > 1500 && !videoLoaded) 
    { 
    // don't scroll 
    document.body.scrollTop=scrollPosition; 
    } 
    else 
    { 
    // reload the variable to match current position 
    scrollPosition=document.body.scrollTop; 
    } 
    } 
    function videoOnPlaying(){ 
    // wait 2 seconds and then disable the max scrollPosition 
    // might want to tweak this too depending 
    setTimeout(function() { 
     videoLoaded = true; 
    }, 2000); 
    } 
    </script>  
</head> 
<body onScroll="bodyOnScroll();"> 
<video autostart onPlay="videoOnPlaying();"></video>

Quelle

2017-01-02 19:08:23 pizzaslice

Hey @pizzaslice danke für deinen Beitrag Verstehst du die UX-Implikationen Leider funktioniert deine Lösung momentan genauso wie mein Problem ... es springt den Benutzer irgendwo auf der Seite bei Video laden. – slawrence10

Safari Browser springt zur Anzeige von HTML5 Autoplay Video

Antwort

Verwandte Themen