• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

scrollTop und offset in % angeben

Dropout2

New member
Hallo,
bin neu hier im Forum. Also erst mal Gruß an Alle...

Zu meinem Problem.
Hier eine if Anweisung die ich nutze:
Code:
if (document.documentElement.scrollTop > 1000 || self.pageYOffset > 1000) {
            $('#einblenden').fadeIn("slow");
        } else if (document.documentElement.scrollTop < 1000 || self.pageYOffset < 1000) {
            $('#einblenden').fadeOut("slow");
        }

Der Code funktioniert. Damit fadet ein Div mit der id "einblenden" nach 1000px scrollen ein und nach dem hochscrollen an gleicher Stelle wieder aus. So weit so gut.
Die Zahl 1000 bezieht sich ja auf das einfaden nach 1000px.
Wie bekomme ich es aber hin, hier anstatt der px eine Angabe in % zu realisieren?
 
mit ein bisschen mathe

Code:
prozent = 20;
fadePosition = (($( document ).height() / 100) * prozent);
if (document.documentElement.scrollTop > fadePosition || self.pageYOffset > fadePosition) {
            $('#einblenden').fadeIn("slow");
        } else if (document.documentElement.scrollTop < fadePosition || self.pageYOffset < fadePosition) {
            $('#einblenden').fadeOut("slow");
        }
ungetestet
 
Ja danke, das hat mir sehr weiter geholfen. Allerdings setzt Dein Code die 20% relativ zur gesamten Seite. Brauche es aber relativ zu einem Div. (Sorry, war mein Fehler). Habe jetzt Deinen Code etwas umgeändert und anstatt zum gesamten Dokument ein Div mit der id "oben" eingesetzt. Schau bitte mal drüber ob der Code so in Ordnung ist oder ob ich hier einen Fehler mache. Im Firefox funzt das ganz schonmal...
Code:
prozent = 100;
fadePosition = (($( '#oben' ).height() / 100) * prozent);
if (document.documentElement.scrollTop > fadePosition || self.pageYOffset > fadePosition) {
            $('#einblenden').fadeIn("slow");
        } else if (document.documentElement.scrollTop < fadePosition || self.pageYOffset < fadePosition) {
            $('#einblenden').fadeOut("slow");
        }
 
ist ok soweit, aber wie groß ist denn dein #oben? Aber wie auch immer wenn du sagst du brauchst es zu genau diesem div, dann ist es korrekt
 
Zurück
Oben