jsfiddle wie bekomme ich den scrollTop Wert innerhalb einer Geige

Here is the jsfiddle jsfiddle wie bekomme ich den scrollTop Wert innerhalb einer Geige

Ich möchte die Klassen ändern, wenn die scrolltop die Werte in der if-Anweisung angegeben erreicht ...

Ich weiß nicht, was dumm Fehler ich gemacht habe, dass ich es nicht bekommen kann

2016-07-26 Caro

Hast du einen Blick auf [die Konsole] geworfen (http://webmasters.stackexchange.com/a/77337/19742)? – George

Ja, und ich kann es nicht finden. Ich versuche, jsfiddle für bessere Beispiele zu verstehen, aber ein Code, der in anderen Fideln funktioniert, wird es nicht tun, wenn ich sie verwende – Caro

Eine Sache zu beachten - sobald du die gute Antwort unten verdaut hast. Sie haben 'background-color: green' auf der ID' container' angegeben. Es spielt keine Rolle, welche Klasse Sie anschließend anwenden, Ihre Hintergrundfarbe ändert sich nicht, da der Stil gegenüber der ID Vorrang vor den Stilen hat, die von der Klasse angewendet werden. Dies ist nur die Art, wie css funktioniert, und hat nichts mit dem Code zu tun. – Jamiec

es gibt ein paar Dinge falsch mit Ihrem Code zu arbeiten:

ich glaube nicht, dass jQuery einhatFunktion
Sie haben eine fehlende schließende Klammer auf dem zweiten, wenn $('#main' < - hier
mit, dass der Aufenthalt, wenn Sie die Klammern aus der scrollTop Funktion
den scrollTop Wert von Haupt Du bist gerade verpaßt haben - es wird immer 0 sein, da es nie scrollt, scrollst du das Fenster

Probiere folgendes aus (Änderungen in Kommentaren);

$(window).on('scroll', function() { // change to scroll rather than onscroll 
    var scrollTop = $(this).scrollTop(); // get scroll top of the thing that is scrolling and cache for better performance 
    if (scrollTop > 100) { 
    $("#container").addClass("red"); 
    } else if (scrollTop > 500) { 
    $("#container").removeClass("red").addClass("blue"); // chain actions 
    } else { 
    $("#container").removeClass("red blue"); // you can pass two classes into this 
    } 
});

Wenn Sie dies in Ihrer Geige verwenden und den Behälter überprüfen, werden Sie die Klasse zu sehen bekommen hinzugefügt (Sie werden es nicht sehen Farbe ändern, wie es Bildschirm, bevor die Klassenänderungen erlischt)

Quelle

2016-07-26 15:31:41 Pete

'Uncaught ReferenceError: $ ist nicht definiert" 'in Ihrem Snippet - Sie haben vergessen, jQuery auszuwählen und die entsprechenden html – Jamiec

@Jamiec Sorry, nicht als Schnipsel gedacht - nur zu beheben der OP-Code – Pete

ja, aber wenn Sie es versuchen, werden Sie sehen, dass es immer noch nicht funktioniert - der Hintergrund ändert sich nicht von grün, weil das CSS gegen eine ID angegeben wird, und hat Vorrang vor der '.red' Klasse. – Jamiec

jsfiddle wie bekomme ich den scrollTop Wert innerhalb einer Geige

Antwort

Verwandte Themen