• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Seite wird kurz weiß beim Seitenaufbau bei Chrome - CSS Problem ?

Conny64

Neues Mitglied
Hi,

ich habe das Problem, dass wenn man einen Link auf der Seite anklickt und dadurch die Seite mit anderem Inhalt neu geladen wird, der Hintergrund erst mal kurz weiß auf leuchtet und dann erst die Hintergrundgrafik wieder geladen wird.
Das führt zu einem "flackernden " Seitenaufbau. Das Problem habe ich komischer weise hauptsächlich im Chrome Brower.
Hat jemand eine Idee wie ich das in CSS evtl. ändern kann.

Hier die Seite www.Number-One.de womit ich das Problem habe

LG Conny
 
Werbung:
Hallo

Das Problem habe ich komischer weise hauptsächlich im Chrome Brower.

Bei mir im Firefox ist das Flackern auch deutlich zu sehen. Egal ob JavaScript blockiert ist oder nicht.

Hat jemand eine Idee wie ich das in CSS evtl. ändern kann.

Also ist das CSS das Problem. Der HTML-Quelltext enthält aktuell 246 teils heftige Fehler, durch die die Zuordnung der CSS-Eigenschaften Probleme bereitet.

https://validator.w3.org/check?verbose=1&uri=http://www.number-one.de/

Die sollten zunächst mal beseitigt werden. Dann wird auch das Flackern behoben sein.

Gruss

MrMurphy
 
Zuletzt bearbeitet:
Hi,
danke für die Info. Ich habe soweit ich konnte alle W3C Fehler behoben. Was jetzt noch übrig ist
(1 Fehler) kommt von einem Plugin im Shop, welches ich nicht verändern kann.

Leider habe ich aber immer noch das Problem wie oben beschrieben

LG Conny
 
Werbung:
Du könntest als Hintergrundfarbe einen Grauton (eine Farbe aus dem Hintergrundbild) einstellen, dann fällt das "Flackern" nicht mehr so stark auf.
 
Die Site führt sehr viele HTTP-Requests aus und da sie nicht auf Ajax basiert, müssen die Dateien bei jedem Routenwechsel neu angefordert werden. Der unerwünschte Effekt resultiert aus dem Nachladen der background2.jpg, und das unterschiedliche Verhalten von Chrome zu FF ergibt sich daraus, dass letzterer diese Datei cached.

Eine Patenlösung habe ich auch nicht, aber mögliche Ansätze wären:
- Anzahl der Requests reduzieren, in dem JS und CSS files zu je einer einzigen Datei kompiliert werden.
- Reihenfolge der inkludierten Dateien verändern. CSS gehört in den Head und JS ans Ende der Seite.
- Notfalls auf das Image verzichten und eine einfache Background-Color verwenden.

Außerdem wird die CSS-Anweisung doppelt ausgeführt, das ist auch nicht schön.
 
Hi, danke für die tolle Hilfe !
Ich habe mich jetzt erst mal dazu durch gerungen nicht das Problem zu lösen sondern eine Alternative einzubinden.
Habe jetzt den Hintergrund als gradient wie folgt gemacht:

html,body,#page{
background-image:linear-gradient(#a8a8a8 0%, #f1f1f1 100%);
background-image: -webkit-linear-gradient(#a8a8a8 0%, #f1f1f1 100%);
background-image: -moz-linear-gradient(#a8a8a8 0%, #f1f1f1 100%);
background-attachment: fixed;
}

Der doppelte Eintrag kam zustande weil ich rum experimentiert habe.
Aber Danke für den Hinweis.

Ich würde mich freuen wenn ihr noch Verbesserungs Ideen habt.

LG Conny
 
Werbung:
Zurück
Oben