jquery Element flackert nach dem Übergang und scrolltop auf ios

9

Nun, das wird schwer ... hoffe, die Gurus haben eine Lösung gefunden!

Das ist schwer zu erklären, aber hier geht ..

Ich habe zwei Elemente:

%Vor%

Was ich hier erreichen möchte, ist folgendes: Element 2 ist überhaupt nicht gestylt, nur ein einfaches Element. Klickt man auf den Knopf, wird # elem2 position, bringt # elem1 wie eine Schublade von links, so dass es oben an der aktuellen Position des Bildschirms ist, # elem2 ist dann versteckt, # elem1 geht nach oben und der Bildschirm scrollt nach oben.

Das Ergebnis ist, dass ich auf der gleichen Seite bin, einen ganz anderen Inhalt auf den unteren laden, ich kann ohne Overscroll blättern (was auf dem iPhone dringend benötigt wird - entfernt die oberen und unteren Balken - eigentlich das ist der Grund, warum ich das brauche).

PROBLEM:

Das Problem ist, dass der Bildschirm bei der letzten $ (window) .scrollTop (0) flackert - der verdammte Bildschirm flackert. Wenn ich das Skript oben auf der Seite einleite, flackert es nicht.

a) Ich habe versucht, die Reihenfolge des Skripts zu ändern, aber das Ändern der Dinge gibt mir nicht die benötigten Ergebnisse. b) Das Ändern des Übergangseffekts auf "linear" macht dies besser, aber Sie können es immer noch sehen.

Ich weiß, dass das Ding hart ist, aber hoffentlich hilft mir jemand dabei!

edit: Was es sieht ist, dass $ ('# elem2'). toggle (0) und $ (window) .scrollTop (0) gleichzeitig auslösen, so dass es im flackern aussieht wie es auch bringt # elem2 an der Spitze, deshalb flackert es ...: / Ich verschwende so 4 Stunden bis jetzt: (

edit2: Auch wenn Sie die animierten Übergänge vollständig entfernen, flimmert es immer noch. Ich gehe schlafen, kann nicht länger wach bleiben ... hoffentlich bekomme ich einen Morgengeschenk: /

    
scooterlord 19.10.2013, 01:21
quelle

6 Antworten

1

Wenn es ein weißer Blitz ist, ist dies eigentlich ein CSS3-Problem. Ich hatte das in der Vergangenheit, versuche das hinzuzufügen.

%Vor%

für die Klassen .anim und .overr.

    
codeaddict 12.12.2013 23:41
quelle
0

Haben Sie überlegt, die Animate-Funktion zu verwenden? Es ist möglich, dies so zu implementieren, dass die nachfolgenden Stiländerungen erst nach Abschluss der vorherigen Animation stattfinden. Natürlich können Sie so viele Animationen wie nötig verschachteln (ich habe nur ein paar zur Veranschaulichung unten geschachtelt), wodurch die Probleme beim Multitasking behoben werden.

%Vor%

Referenzen: Ссылка

    
talegna 28.10.2013 11:30
quelle
0

nicht sicher, ob dies Ihnen helfen wird, aber ich hatte ein ähnliches Problem mit iOS Scroll-Animationen. Ich löste es, indem ich den scrollTo benutze und die Achse einstelle zB:

%Vor%

das war das einzige, was ich gefunden habe, das das Flimmern stoppen würde.

    
Bn Mk 12.11.2013 15:13
quelle
0

Meine Lösung ist nicht direkt verknüpft, aber sie enthält sowohl flackernde, fixierte Elemente als auch scrollTop (). Daher bin ich mir sicher, dass Google jemanden hierher bringen wird.

Ich habe die Animation in den Schritt eingefügt, anstatt die Eigenschaft scrollTop gerade zu animieren. Hoffe das hilft.

%Vor%     
Marcus 03.12.2013 19:41
quelle
0

Leider ist die Art, wie das iOS Elementübergänge verarbeitet, irgendwie seltsam. Sie "aktualisieren" am Ende einer Rolle. Der einzige Weg, wie ich das vermeiden kann, ist mit etwas statischen Elementen wie Navigationsleisten oder schwebenden Fußzeilen. Wo sie kein Javascript oder CSS verwenden, um die Darstellung zu ändern. Ich weiß, dass dies keine Lösung ist, aber hoffentlich hilft Ihnen das, das iOS-Webkit besser zu verstehen:)

    
werm098 12.12.2013 00:28
quelle
0

Ich wollte zum Anfang einer Seite mit 0ms Animation scrollen, aber es würde am häufigsten nach dem Scrollen flimmern - auf ios 8.3. Ich ging zurück, um eine Animation von 400ms hinzuzufügen und ScrollTo dafür zu verwerfen:

%Vor%

0 flackern jetzt .. und eine nett animierte Scroll zum oberen Rand der Seite. 1000ms war ruckelnd. hoffe, das hilft jemandem.

    
quelle

Tags und Links