Verwendung: Pausieren von Videos beim vertikalen Scrollen

FrischBlau's Avatar

FrischBlau

14 Jan, 2021 02:36 PM

Produkt: Slider Pro Contao

Hallo,
ich suche nach einer Lösung für folgende Situation: In einem Slider gibt es mehrere Slides. In den Slides sind jeweils Videos als Hintergrundvideos eingebunden. Wenn ich zu diesem Slider scrolle, startet das Hintergrundvideo des ersten Slides automatisch. Wenn ich zum zweiten Slide weiterklicke, stoppt das Hintergrundvideo des ersten Slides und das Hintergrundvideo des zweiten Slides startet. Sehr gut so weit.
Wenn ich nun aber auf der Seite z.B. nach unten weiter scrolle, läuft das Hintergrundvideo des Slides weiter, auch wenn sich der Slider nicht mehr im Viewport befindet. Das ist unschön, wenn das Hintergrundvideo eine Audiospur hat.
Das Scrollevent kann ich über Waypoints, IsInView o.ä. erkennen. Wie kann ich das Hintergrundvideo (z.B. via jQuery) ansprechen und pausieren lassen?

Vielen Dank vorab!

  1. Support Staff 1 Posted by RockSolid Theme... on 15 Jan, 2021 01:14 PM

    RockSolid Themes's Avatar

    Vielen Dank für Ihre Frage.

    Die Video-Elemente innerhalb des Sliders lassen sich z. B. mit folgendem JavaScript pausieren:

    jQuery('.mod_rocksolid_slider').find('video').each(function() {
        if (this.pause) {
            this.pause();
        }
    });
    
  2. 2 Posted by FrischBlau on 18 Jan, 2021 12:06 PM

    FrischBlau's Avatar

    Das war´s! Danke für den Denkanstoß & einen guten Start in die Woche!

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac