Ich baue eine einzelne Seite mit der oberen Navigationsleiste, die zu verschiedenen Abschnitten auf der Seite führt. Ich habe es mit Scrollspy als <body data-spy="scroll" data-offset="50" id="home"> verknüpft. Das funktioniert großartig. Jeder Abschnitt ist in der Navigation hervorgehoben.
Das Problem liegt im letzten Abschnitt. Da es sich um einen kurzen Abschnitt handelt und nicht die gesamte Seite ausgefüllt wird, wird id="contact" niemals erreicht, und daher wird das Navigationselement nicht hervorgehoben.
Ich stelle fest, dass auf der Bootstrap-Beispielseite beim Erreichen des letzten Elements dieses hervorgehoben wird id ist erreicht - und dennoch befindet sich die id genau wie alle anderen Abschnitte an der Spitze des Abschnitts.
Ich habe die benutzerdefinierte application.js -Datei durchgesehen, sehe aber nichts in Bezug auf scrollspy-Verhalten.
Kann jemand Licht darauf werfen?
Ich habe nur selbst nach der Antwort gesucht. Die Bootstrap-Demo-Seite hat definitiv etwas anderes gemacht als meine Seite, wenn es um den letzten Gegenstand ging. Ich habe auch durch application.js geschaut, aber nichts gesehen. Schließlich entschied ich mich, ihre Version von scrollspy.js mit meiner zu vergleichen. Sie verwenden v2.0.4, während ich v2.0.2 hatte. Ich habe meine Version durch die neue Version ersetzt und es hat einfach wie erwartet funktioniert.
Dann habe ich auf das Bootstrap-Changelog hingewiesen und festgestellt, dass v2.0.3 am 24. April 2012 veröffentlicht wurde. Eine der aufgeführten Änderungen war "Immer das letzte Element in scrollspy auswählen, wenn Sie das Ende des Dokuments oder Elements erreicht haben ".
Ich denke, sie haben es ruhig intern behoben, seit ich den Bootstrap heruntergeladen habe. Vielleicht hast du das auch schon herausgefunden, aber hoffentlich hilft es anderen, die nach der gleichen Antwort suchen.
Für einige könnte dieses Problem auf ein Problem mit quirks / DOCTYPE zurückzuführen sein. Wenn sich der Bildlaufbereich auf dem Hauptteil befindet, berechnet scrollspy die Höhe des Ansichtsfensters vom Fensterobjekt. Wenn Sie jQuery 1.8.2 verwenden und nicht über das richtige DOCTYPE-Set verfügen, gibt die scrollspy-Berechnung für die Höhe des Ansichtsfensters die Gesamthöhe zurück, die bewirkt, dass das letzte Element immer ausgewählt wird.
Wenn Sie zu jQuery 1.7.2 wie auf Ссылка zurückkehren, wird es wieder funktionieren, oder Sie können Stellen Sie den richtigen DOCTYPE ein.
Hier finden Sie weitere Informationen zum Thema "Notabug": Ссылка
Erhöhen Sie einfach Ihr data-offset Attribut auf etwas Größeres wie 500 , wie folgt:
Die Bootstrap-Demo funktioniert gut, weil sie auch die Höhe des Subnavs zusammen mit dem 50px offset des Datenattributs ausgleicht.
Ich habe einen Workaround. In Zeile 40 von scrollspy JS von twitter siehst du:
%Vor%Einfach das entfernen. Dies führt die Verfahrensmethode in einem geschickten Versuch aus, sie zu starten. Aber das wird verarbeitet, wenn Sie sowieso scrollen, also entfernen Sie es einfach und Sie sollten gut sein.
Bei der Verwendung von jQuery 1.8.3 und einem html5-Doctype konnte ich feststellen, dass Scrollspy mit einem anfänglichen Skalierungsfaktor von 1 fehlschlug:
%Vor%Ich habe den Verweis auf initial-scale = 1 entfernt und scrollspy hat angefangen zu arbeiten.
Ich habe diese Frage auf der Suche nach einer Lösung für mein Problem gefunden. Scrollspy funktionierte gut, bis es die letzten 4 Abschnitte erreichte. Als es passierte, sprang es sofort zu den letzten Abschnitten und vermied 3 andere auf seinem Weg. Es wurde durch relativ kleine Größen dieser Abschnitte verursacht. Dank Jons Antwort entschied ich mich für scrollspy skript und fand folgende Zeilen:
%Vor%Sie sind dafür verantwortlich, den letzten Abschnitt auszuwählen, wenn das Ende der Seite erreicht ist. Das Kommentieren kann in Fällen wie meiner helfen (3 Abschnitte gleichzeitig springen), aber es verhindert, dass der letzte Abschnitt erreicht wird, wenn er zu klein ist.
Tags und Links javascript twitter-bootstrap