Anni: Bild soll doppelte Scrollgeschwindikeit haben

SELF-Forum

Bild soll doppelte Scrollgeschwindikeit haben

Anni (Versionen)
– Informationen zu den Bewertungsregeln

Hallo Zusammen,

ein Bild soll sich beim runter scrollen mit doppelter scrollgeschwindikeit bewegen. Ich hab bereits verschiedenes ausprobiert und nichts funktioniert.

function geschwindigkeit(){
	
	var element = document.getElementById("wolke");
     var height = element.window.pageYOffset*2;
    
	 document.getElementById("wolke").innerHTML =height;
}

ich habe bereits weiter oben erstellt: var y = window.pageYOffset; .... was mir auf der seite die x y koordinaten ausgibt. Es soll kein JQuery verwendet werden. Ich bin für jeden verbesserungsvorschlag dankbar.

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Bild soll doppelte Scrollgeschwindikeit haben

    Gunnar Bittersmann Homepage des Autors
    – Informationen zu den Bewertungsregeln

    @@Anni

    ein Bild soll sich beim runter scrollen mit doppelter scrollgeschwindikeit bewegen. Ich hab bereits verschiedenes ausprobiert und nichts funktioniert.

    Hast du auch ausprobiert, einen Blick in die Fehlerkonsole im Entwicklertool deines Browsers zu werfen? Was sagt die? Vielleicht sowas wie 'TypeError: element.window is undefined'?

    LLAP 🖖

    --
    „Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
    „Hat auf dem Forum herumgelungert …“
    (Wachen in Asterix 36: Der Papyrus des Cäsar)
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

  2. Bild soll doppelte Scrollgeschwindikeit haben

    Jörg Reinholz Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Moin!

    Das hier macht nicht das, was Du willst, enthält aber alle Elemente, die Du brauchst:

    <!doctype html>
<html>
    <head>
        <title>The flying Picture</title>
        <script>
            var TopStatic=100;
            window.onscroll=function () {
                var TopNew = TopStatic + window.pageYOffset * 2;
                document.getElementById('The_Flying_Picture').style.top=TopNew + 'px';
            }

        </script>
    </head>
    <body>
        <div style="height:2000px; padding-left:200px">The Flying Picture</div>
        <div id="The_Flying_Picture" style="width:100px; height:100px; position:absolute;  z-index:2; top:100px; left:50px; border:2px solid red;">The Flying Picture</div>
    </body>
</html>

    Jörg Reinholz

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln