CSS wird erst nach reload korrekt dargestellt

[Dr. Zecke]

Hi

Ich habe ein Problem mit meiner ebay Vorlage, die ich selber geschrieben habe.
An sich funktioniert das Template gut, allerdings wird ab und an, wenn ich
eine meiner Angebote auf ebay anschaue, die ich mit diesem Template erstellt habe, die Seite nicht korrekt dargestellt.

Komischer Weise passiert das bei mir nur unter Firefox. Und nach einem reload der Page ist wieder alles normal.
Es sieht so aus, als ob das irgendein css Problem sei. Ich habe auch schon selber den ganzen Tag nach dem Fehler gesucht aber alles was ich probiert habe, war am Ende für die Katz. Ich brauche eindeutig Hilfe. Der Fehler ist auch auf anderen PCs sichtbar was katastrophal ist für mich. Immerhin will ich ja meine Ware verkaufen.

Versucht habe ich den Fehler lokal zu simulieren, indem ich den quellcode 1:1 von der ebay page kopiert habe. Danach habe ich zuerst alle Scripts entfernt und dann nach und nach die css befehle gelöscht, die dafür verantwortlich sein könnten. Da habe ich dann auch irgendwann gedacht ich habs gefunden, allerdings stellte sich dann raus, das ich das problem nur lokal lösen konnte aber nicht online. Schwer zu erklären.

Also irgendwas läuft da jedenfalls schief, ich hoffe echt ihr könnt mir helfen!

Auf dem Bild, was ich angehangen habe, sieht man, wie die Seite fehlerhaft dargestellt wird. Nach einem klick auf page neu laden baut sich die seite dann korrekt auf.

Hier ein Link zu einem meiner Angebote, bei dem der Fehler auftritt:
Problemfall
(Das soll natürlich keine Werbung sein)

greetz

- - - Aktualisiert - - -

Nach weiteren Tests kann ich auf jeden Fall folgende .css als Übeltäter ausmachen:

<link rel="stylesheet" type="text/css" href="http://ir.ebaystatic.com/rs/v/l3xnpxsbwi4qpmetzgoakqfynuo.css">
<link rel="stylesheet" type="text/css" href="http://ir.ebaystatic.com/rs/v/4vodhd0o2u2nvmmusfusc3uoomj.css">

Wenn man die 2 Dateien quasi "ausschaltet", sieht die Seite fast wieder normal aus.

Das sind Dateien mit denen ich nichts zu tun habe, die scheint ebay in jedes Angebot reinzuklatschen.

Bedauerlicher Weise habe ich nur Firebug als Tool. Ich finde das Programm zwar gut aber man kann damit irgendwie nicht auf die Schnelle rausfinden, welche Befehle für das Problem verantwortlich sind.

Wenn ich wüsste was in den files das Problem ist, könnte ich diese Werte in einer von mir erstellten .css einfach mit dem !important code überschreiben.

 

[mikdoe]

worauf muss man denn achten? was genau ist der fehler?

 

[Dr. Zecke]

Ich habe mal 2 Grafiken erstellt.

Die erste Grafik zeigt die Seite nach dem ersten Mal laden an.
Dort sind z.B. oben Rechts beim "Suchen" Feld die css-Werte nicht korrekt.
Auch funktioniert das Script nicht, was eine zoom Funktion auslösen soll, wenn man mit der Maus über das Bild geht. (ist auf dem anderen Bild zu sehen)

Bei Bild 2 wird alles korrekt dargestellt. Das Such-Feld mit den richtigen css Eigenschaften und alle Java Scripts funktionieren tadellos.

Wie wird die Seite bei dir dargestellt?

 

[mikdoe]

und was muss ich machen damit ff "denkt" es wäre wieder der erste besuch um den fehler zu sehen? deine fehlerbeschreibung ist sehr ungut. versetz dich doch mal in einen hinein der die seite nicht kennt und auch mehr als genug anderes zu tun hat!

 

[Dr. Zecke]

Also erstmal sei gesagt, dass ich hier niemanden seine Zeit rauben will.
Ich finde es nett, dass du dir die Seite mal angeguckt hast aber fühl dich bitte nicht verpflichtet, wenn dir deine Zeit dafür zu schade ist.

Meine Zeit ist auch kostbar, daher versuche ich schon so gut es geht mein Problem zu schildern.
Mehr als zu schreiben, dass die Seite einmal die Java Scripts läd, und das andere Mal nicht, müsste doch eigentlich ausreichen als Fehlerbeschreibung.

Zu deiner Frage:
Wenn ich den Browser geschlossen habe und wieder öffne, dann sieht die Seite wieder aus wie auf Bild 1 (scripts gehen nicht, css falsch), beim reload läuft dann alles.

Ich habe heute bei meinen Recherchen erfahren, dass vielleicht das Problem das Programm "CCleaner" sein könnte, welches auch auf jedem Rechner installiert war, auf dem ich bisher die Seite testen konnte.
Deshalb wäre es schön in Erfahrung zu bringen, ob bei dir die Scripts ausgelöst werden beim ersten Mal laden.

 

[mikdoe]

Also erstmal sei gesagt, dass ich hier niemanden seine Zeit rauben will.

In dem Moment wo du hier postest beschäftigen sich Leute mindestens mit Lesen des Beitrags. Und wenn man dann nicht weiter kommt, weil eine Fehlerbeschreibung fehlt ist das ärgerlich.

Ich finde es nett, dass du dir die Seite mal angeguckt hast aber fühl dich bitte nicht verpflichtet, wenn dir deine Zeit dafür zu schade ist.

Die Zeit ist mir nur dann zu schade, wenn ich ellenlangen Text gelesen habe und mir hinterher denke hmm, was ist jetzt eigentlich die Frage. Wo war die Fehlerbeschreibung?

Meine Zeit ist auch kostbar, daher versuche ich schon so gut es geht mein Problem zu schildern.

Genau das sollte mein Feedback sein, du hattest das Problem garnicht geschildert. Das ist ja das doofe. Aber ist jetzt egal, wie haben es ja. Vielleicht beim nächsten mal das Problem in den Vordergrund stellen und alle Vermutungen zur Ursache weg lassen.

Mehr als zu schreiben, dass die Seite einmal die Java Scripts läd, und das andere Mal nicht, müsste doch eigentlich ausreichen als Fehlerbeschreibung.

Zu einer Fehlerbeschreibung gehört immer auch die Frage "wie kann ich den Fehler erkennen" und vor allen Dingen: "wie kann ich ihn reproduzieren"!
Reiten wir nicht mehr drauf herum.

Wenn ich den Browser geschlossen habe und wieder öffne, dann sieht die Seite wieder aus wie auf Bild 1 (scripts gehen nicht, css falsch), beim reload läuft dann alles.

Stimmt, ist bei mir auch so.

Ich habe heute bei meinen Recherchen erfahren, dass vielleicht das Problem das Programm "CCleaner" sein könnte, welches auch auf jedem Rechner installiert war, auf dem ich bisher die Seite testen konnte.
Deshalb wäre es schön in Erfahrung zu bringen, ob bei dir die Scripts ausgelöst werden beim ersten Mal laden.

Nein. Solche Software hab ich noch nie benutzt, weil sie prinzipbedingt nur mehr kaputt als besser macht.

Frage: Hast du mal deine Browserkonsole auf gemacht (F12)? Kannst du mal kurz was zu diesen Fehlern sagen bitte.
Bei mir läuft die Konsole so voll mit Fehlern, dass der Browser lagt. Was ist das alles?

 

[Dr. Zecke]

Kritik angenommen. Zugegeben, der erste Beitrag war auch etwas wirr, da ich selber noch nicht genau wusste, wo genau das Problem liegt. Das war mehr Brainstorming.
An der Stelle war mir auch noch nicht aufgefallen, dass die Scripts nicht laden. Dachte, es wäre ein reines CSS Problem, hatte daher den Thread auch hier im CSS Forum gestartet.
Ich werde den ersten Beitrag oben später mal überarbeiten.

Die Vermutungen zur Ursache könnten allerdings hilfreich sein für manche.

Nee, also bei mir läuft da in der Konsole nichts voll mit Fehlern irgendwie.
Bin jetzt hier gerade am gucken was du meinen könntest. Bei Fehlern wird mir in der Konsole nur ein "URIError", ein "TypeError: phints is undefined" und ein "ReferenceError: iam_data is not defined" angezeigt. Komischerweise aber auch nicht immer.

Also die Scripts die ich selber reingemacht habe heißen:

elevatezoomneu.js (Für die Zoom Funktion)
vollbild4art.js (das aktiviert bloß eine Fancybox)
zoom.js (Für die Gallery, um die thubnail bilder auszuwählen)
jquery-1.10.1.min.js
jquery.fancybox.js
jquery.fancybox-thumbs.js (Ein Zusatz für die Fancybox. Es werden dadurch thumbnail bilder angezeigt)

Die restlichen Scripts die geladen werden sind von ebay, da habe ich auch keine Informationen drüber, was die genau alle bewirken.

 

[mikdoe]

Ob die Scripte nun von dir sind oder nicht, sie verursachen harte Fehler. Und wenn das so ist braucht man sich nicht wundern, dass der Browser etwas unerwartetes tut. Mach einfach mal den FF frisch auf, drücke auf F12 und ruf dann mal diesen Artikel auf.
Bei mir sieht das so aus:

Und das geht darunter noch weiter mit den Fehlern, siehste ja an dem Scrollbalken rechts.
Was mich besonders irritiert ist, dass da eine JS Datei namens DevToolsUtils.js eingebunden ist. Wenn es das ist was der Name suggeriert hat das aber nichts auf einer produktiven Live Seite zu suchen.

Das solltest du m.E. erstmal abklären. Vorher macht es überhaupt keinen Sinn, über fehlerhafte Darstellung der Seite zu sprechen.

 

[Dr. Zecke]

Ich habe mal alle Scripts auf die ich Zugriff habe, rausgeworfen, für das verlinkte Angebot.
Bei mir wird jetzt kein "DevToolsUtils.js" Fehler mehr angezeigt. Dann war wohl doch ein script von mir dafür verantwortlich.

Kannst du bitte nochmal checken, ob der Fehler auch bei dir nicht mehr angezeigt wird?

"Und wenn das so ist braucht man sich nicht wundern, dass der Browser etwas unerwartetes tut."

Ok, falls der devtools-Fehler jetzt draußen ist, macht der Browser dennoch noch die Darstellungsfehler bei mir, strange.

Aber war ja eh nicht gesagt, dass das eigentlich Problem daran lag.

 

[mikdoe]

hast du mal die konsole beim ersten aufruf mit der vom zweiten aufruf verglichen?

 

[Dr. Zecke]

Jau habe ich..
beim ersten Aufruf, wenn die sachen noch falsch dargestellt werden steht da ein error der mir aufgefallen ist:

Toolkit.Telemetry ERROR TelemetryStorage::loadAbortedSessionPing - error removing ping: PingReadError JS Stack trace: PingReadError@TelemetryStorage.jsm:80:15

Sagt dir das was?

Der kommt beim zweiten laden dann nicht mehr.
Auch dann kommen erst die Fehlermeldungen, dass meine scripts nicht gefunden werden. (hat ja seine Richtigkeit, habe sie ja ausgestellt. In diesem Fall umbenannt)
Das zeigt mir zumindest, dass die Scripts tatsächlich erst beim zweiten laden berücksichtigt werden.

 

[mikdoe]

da bin ich überfragt. google hat einiges zu "toolkit telemetry" aber eine saubere doku dazu finde ich trotzdem nicht.

übrigens kann man das verhalten auch im chrome sehen.

@korbinian und hesst: habt ihr das schonmal gesehen?

 

[kkapsner]

Das Problem liegt daran, dass eBay beim ersten Laden deine Seite direkt in das HTML einbaut. Beim zweiten wird es in ein <iframe> gepackt. Du musst also mit den CSS-Angaben von eBay zu Recht kommen.

Du musst also bei dem eBay-API nachlesen, wie du das Laden in einem iFrame erzwingen kannst.