Jquery Content nachladen - Flackern - Forum

Redphex

Legend
RabbitOfNegativeEuphoria

Registered: Mar 2000
Location: Macrodata Refine..
Posts: 11817

07.08.2015 - 09:05

Ich verwend auf einer Webseite jquery, um divs mit Inhalt zu befüllen.
Beispiel - http://redphex.net/test.html

Das flutscht, aber mich stört das Flackern (vorher nix, dann content) beim Page-Refresh.

Anscheinend google ich immer am Problem vorbei, oder Lösungen wie http://james.padolsey.com/snippets/...dom-flickering/ beziehen sich auf was anderes.

Was funktioniert ist, den body initial auf display:none zu setzen und mit 100ms verzögerung erst einzublenden.
Das ist aber auch nicht wirklich elegant.

Kennt da wer noch andere Lösungsansätze?

Bearbeitet von Redphex am 07.08.2015, 19:49

kleinerChemiker

Here to stay

Registered: Feb 2002
Location: Wien
Posts: 4349

07.08.2015 - 09:34

Bei mir flackert nix. :confused:

SailorChibi

Addicted

Registered: Aug 2010
Location: Wien
Posts: 382

07.08.2015 - 10:55

Bei mir "flackerts" auch (Chrome).

Holst du dir den Content über AJAX?

AdRy

Auferstanden

Registered: Oct 2002
Location: Wien
Posts: 5239

07.08.2015 - 10:57

Ich glaub er meint, dass wenn du F5 drückst das ganze bild refreshed wird und nicht nur der inhalt -> "flackern"

Das Problem ist hier glaub ich, dass du die ganze tabelle per jquery aus einem erxternen html ladest und nicht nur den inhalt der zellen.

Schau dir mal andere websites an: JEDES dynamische elemente "flackert" beim refresh. Die Lösung ist wie gesagt nur den inhalt der Zellen, statt die ganze tabelle zu laden.

SailorChibi

Addicted

Registered: Aug 2010
Location: Wien
Posts: 382

07.08.2015 - 11:59

Zitat von AdRy
Die Lösung ist wie gesagt nur den inhalt der Zellen, statt die ganze tabelle zu laden.

Er kann ja vorher nicht wissen wie viele Zellen er haben wird, wenn der Content dynamisch ist.
Mmn gibt es dafür keine Lösung, weil AJAX einfach so funktioniert.

1) Seite wird geladen (Tabelle ist leer)
2) Javascript wird getriggert
3) Javascript lädt Content
4) Seite wird aktualisiert (Tabelle ist voll)

AdRy

Auferstanden

Registered: Oct 2002
Location: Wien
Posts: 5239

07.08.2015 - 13:03

Zitat von SailorChibi
Er kann ja vorher nicht wissen wie viele Zellen er haben wird, wenn der Content dynamisch ist.

z.b. nur den tabellen header fix haben und die zeilen dynamisch dazu laden. Dann flackert wenigstens nicht alles. oder mit animation die zeilen nacheinander reinfaden lassen, kann man alles machen.

Redphex

Legend
RabbitOfNegativeEuphoria

Registered: Mar 2000
Location: Macrodata Refine..
Posts: 11817

07.08.2015 - 18:07

Bis sich was besseres findet, werde ich das main div mit einem 300ms fadeIn versehen.
Das sieht zumindest etwas kontrollierter aus als sonstigen browserspezifischen Zuckungen und stört kaum.

Redphex

Legend
RabbitOfNegativeEuphoria

Registered: Mar 2000
Location: Macrodata Refine..
Posts: 11817

07.08.2015 - 19:48

Und bessere Lösung ist sogar ganz einfach.

Es gibt ja keinen Grund, die Erstansicht der content-divs (sprich die Tabelle im Beispiel) nicht schon im parent.html zu haben.
Wenn sich dann was am content ändert (durch klick oder sontwas) wirds ja trotzdem ersetzt.

Content vorhanden -> kein Flackern.

11Fire01

Here to stay

Registered: Dec 2002
Location: austria
Posts: 2417

11.08.2015 - 08:54

node gäbs auch noch

Redphex Legend RabbitOfNegativeEuphoria Registered: Mar 2000 Location: Macrodata Refine.. Posts: 11817	07.08.2015 - 09:05 Ich verwend auf einer Webseite jquery, um divs mit Inhalt zu befüllen. Beispiel - http://redphex.net/test.html Das flutscht, aber mich stört das Flackern (vorher nix, dann content) beim Page-Refresh. Anscheinend google ich immer am Problem vorbei, oder Lösungen wie http://james.padolsey.com/snippets/...dom-flickering/ beziehen sich auf was anderes. Was funktioniert ist, den body initial auf display:none zu setzen und mit 100ms verzögerung erst einzublenden. Das ist aber auch nicht wirklich elegant. Kennt da wer noch andere Lösungsansätze? Bearbeitet von Redphex am 07.08.2015, 19:49
kleinerChemiker Here to stay Registered: Feb 2002 Location: Wien Posts: 4349	07.08.2015 - 09:34 Bei mir flackert nix.
SailorChibi Addicted Registered: Aug 2010 Location: Wien Posts: 382	07.08.2015 - 10:55 Bei mir "flackerts" auch (Chrome). Holst du dir den Content über AJAX?
AdRy Auferstanden Registered: Oct 2002 Location: Wien Posts: 5239	07.08.2015 - 10:57 Ich glaub er meint, dass wenn du F5 drückst das ganze bild refreshed wird und nicht nur der inhalt -> "flackern" Das Problem ist hier glaub ich, dass du die ganze tabelle per jquery aus einem erxternen html ladest und nicht nur den inhalt der zellen. Schau dir mal andere websites an: JEDES dynamische elemente "flackert" beim refresh. Die Lösung ist wie gesagt nur den inhalt der Zellen, statt die ganze tabelle zu laden.
SailorChibi Addicted Registered: Aug 2010 Location: Wien Posts: 382	07.08.2015 - 11:59 Zitat von AdRy Die Lösung ist wie gesagt nur den inhalt der Zellen, statt die ganze tabelle zu laden. Er kann ja vorher nicht wissen wie viele Zellen er haben wird, wenn der Content dynamisch ist. Mmn gibt es dafür keine Lösung, weil AJAX einfach so funktioniert. 1) Seite wird geladen (Tabelle ist leer) 2) Javascript wird getriggert 3) Javascript lädt Content 4) Seite wird aktualisiert (Tabelle ist voll)
AdRy Auferstanden Registered: Oct 2002 Location: Wien Posts: 5239	07.08.2015 - 13:03 Zitat von SailorChibi Er kann ja vorher nicht wissen wie viele Zellen er haben wird, wenn der Content dynamisch ist. z.b. nur den tabellen header fix haben und die zeilen dynamisch dazu laden. Dann flackert wenigstens nicht alles. oder mit animation die zeilen nacheinander reinfaden lassen, kann man alles machen.
Redphex Legend RabbitOfNegativeEuphoria Registered: Mar 2000 Location: Macrodata Refine.. Posts: 11817	07.08.2015 - 18:07 Bis sich was besseres findet, werde ich das main div mit einem 300ms fadeIn versehen. Das sieht zumindest etwas kontrollierter aus als sonstigen browserspezifischen Zuckungen und stört kaum.
Redphex Legend RabbitOfNegativeEuphoria Registered: Mar 2000 Location: Macrodata Refine.. Posts: 11817	07.08.2015 - 19:48 Und bessere Lösung ist sogar ganz einfach. Es gibt ja keinen Grund, die Erstansicht der content-divs (sprich die Tabelle im Beispiel) nicht schon im parent.html zu haben. Wenn sich dann was am content ändert (durch klick oder sontwas) wirds ja trotzdem ersetzt. Content vorhanden -> kein Flackern.
11Fire01 Here to stay Registered: Dec 2002 Location: austria Posts: 2417	11.08.2015 - 08:54 node gäbs auch noch

Jquery Content nachladen - Flackern

Forum Index > Software > Coding Stuff

Redphex

kleinerChemiker

SailorChibi

AdRy

SailorChibi

AdRy

Redphex

Redphex

11Fire01