How to: Webseite Scroll Video ohne Mouse Stops

  1. Installiere OBS. https://obsproject.com/de

2. Öffne OBS Studio.

3. Klicke unter Quellen auf das + und wähle Fensteraufnahme.

4. Wähle deinen Browser aus. Dürfte sicher Chrome sein.

Wichtig: Falls du den Mauszeiger nicht im Video haben willst, entferne den Haken bei „Mauszeiger aufnehmen“.

Du kannst die Alt-Taste gedrückt halten und an den Rändern des roten Rahmens im OBS-Vorschaufenster ziehen, um die Browser-Adressleiste und die Tabs wegzuschneiden (Cropping). Da du aber später sicher noch selbst editierst, und die Ränder des Videos über den sichtbaren Rand ziehen kannst, ist das nicht wichtig.

Das JavaScript-Script mit „Stopp-Punkt“
Dieses Script scrollt bis zu einer von dir definierten Pixel-Position und bleibt dort stehen. Das ist ideal, wenn du nur bis zu einem bestimmten Sektor (z. B. dem Footer oder einem Produkt) scrollen willst. Bei mir kommt unter dem Event Kalender noch sehr viel Text. Den brauche ich nicht für das IG Reel.

    1. Öffne die Webseite.

    2. Drücke F12 -> Reiter Console.

    3. Füge diesen Code ein (Passe die Werte oben im Code an):

    JavaScript

    (function() {
        // --- EINSTELLUNGEN ---
        const stopPixel = 3000;    // Wo soll der Scroll stoppen? (in Pixeln von oben)
        const duration = 15000;    // Wie lange soll es dauern? (in Millisekunden, 15s = 15000)
        // ---------------------
    
        const startPos = window.pageYOffset;
        const distance = stopPixel - startPos;
        let startTime = null;
    
        function animation(currentTime) {
            if (startTime === null) startTime = currentTime;
            const timeElapsed = currentTime - startTime;
            
            // Lineare Berechnung für ruckelfreies Scrollen
            const nextStep = (distance * timeElapsed / duration) + startPos;
    
            window.scrollTo(0, nextStep);
    
            if (timeElapsed < duration) {
                requestAnimationFrame(animation);
            } else {
                window.scrollTo(0, stopPixel);
                console.log("Scroll-Vorgang beendet.");
            }
        }
    
        requestAnimationFrame(animation);
        console.log("Aufnahme starten! Scroll beginnt in 3 Sekunden...");
        
        // Kleiner Delay, damit du Zeit hast, auf "Aufnahme starten" zu klicken
        setTimeout(() => {
            requestAnimationFrame(animation);
        }, 3000); 
    })();

    1. Der optimale Workflow
      Pixel-Ziel finden: Scrolle manuell zu dem Punkt, an dem das Video enden soll. Gib in der Konsole window.pageYOffset ein. Die Zahl, die erscheint, trägst du oben im Script bei stopPixel ein.

    Vorbereiten: Scrolle die Seite wieder ganz nach oben.

    Script einfügen: Kopiere das Script in die Konsole, aber drücke noch nicht Enter.

    Starten: Drücke Enter im Browser. Du hast nun 3 Sekunden Zeit (siehe setTimeout), um in OBS auf „Aufnahme starten“ zu klicken.

    Ende: Sobald das Script stoppt, klickst du in OBS auf „Aufnahme stoppen“.

    COOLE NUMMER