jQuery-Position für klebrige Header ändern

8

Im Folgenden finden Sie ein kleines Skript, das den auf iOS-Geräten sichtbaren Sticky-Header-Effekt simuliert.

%Vor%

Ändert die Position jedes Elements, indem es seinen Status von postion:absolute, top:0 nach position:absolute, bottom:0; ändert und gleichzeitig den enthaltenden <ul> von position:relative in position:static

ändert

BEISPIEL: Ссылка

Gibt es etwas, das getan werden kann, um es ein wenig zu glätten? In Chrome und Firefox sieht es ein wenig ruckelig aus und manchmal kann es einen Bruchteil einer Sekunde dauern, bis es ausgelöst wird, was sich bemerkbar macht, weil der sticky header zu blinken scheint.

    
Robin Knight 21.09.2012, 16:21
quelle

1 Antwort

2

Ich könnte mir vorstellen, dass das zuckende Twittern ein Ergebnis von Leistungsproblemen in jQuery und JavaScript ist

In diesen Artikeln finden Sie einige Tipps zur Optimierung der Leistung Ihrer Skripts:

Auch - mehr als das, es sieht so aus, als ob die abs -Klasse wiederholt bei jedem Feuern des scroll -Ereignisses hinzugefügt und entfernt wird, wenn das position.top < 0 einer Liste einer Liste ist

Dies führt zwar nicht zu visuellen Zuckungen, aber es führt dazu, dass ein wenig Speicherplatz unnötig verbrannt wird.

Auch wie oben erwähnt, war Ihr HTML nicht gültig.

Sehen Sie diese Geige mit ein paar angewendeten Optimierungstechniken, gültigem HTML und Entfernen von unnötigen Klassenmanipulationen:

Ссылка

    
tmsimont 04.10.2012 16:07
quelle

Tags und Links