Html-Seite mit jquery und dir = rtl erscheint in Chrome leer

9

In den letzten Monaten habe ich ein seltsames Phänomen beobachtet, bei dem Chrome eine Webseite lädt und nichts anzeigt, bis ich mit dem Scrollen anfange. Zuerst dachte ich, das sei ein Problem mit der Seite, dann ein Fehler in einer neueren Version von Chrome, aber jetzt denke ich, dass es mit einem Konflikt zwischen jQuery und rtl zu tun hat. Im folgenden Beispiel wird eine leere Seite angezeigt, bis ich mit dem Bildlauf beginne:

%Vor%

Dies tritt nicht immer auf, aber es passiert ziemlich regelmäßig auf meinem Computer (z. B. ~ 70% der Aktualisierungen). Stellen Sie sicher, dass die Entwicklerwerkzeuge geschlossen sind - aus irgendeinem Grund passiert es nicht, wenn sie geöffnet sind.

Durch das Entfernen von dir="rtl" wird dies verhindert.

Durch das Entfernen von <script src="https://code.jquery.com/jquery-1.11.1.js"></script> wird dies ebenfalls verhindert.

Ich bin mir nicht sicher, was ich daraus machen soll. Sieht das jemand anders? Irgendwelche Ideen, wie man das löst?

(Übrigens verwende ich Chrome 58.0.3029.110 (64-Bit) unter Mac OS 10.12.5)

Hier ist ein Link zu einer Beispielseite .

So sieht es aus, bevor ich mit dem Scrollen anfange , und Hier sieht es so aus, als ob das Scrollen der Instanz beginnt .

    
Roy Sharon 28.05.2017, 08:33
quelle

4 Antworten

2

Das Attribut dir kann von CSS direction: rtl; überschrieben werden, wenn es um die Präsentation von Inhalten geht:

Da die Direktionalität des Textes semantisch verwandt ist, schlage ich vor, dass Sie dir='rtl' in Javascript hinzufügen, wenn jQuery geladen wird. Auf diese Weise beeinträchtigt dir jQuery nicht, wenn die Seite geladen wird.

%Vor%
    
j-printemps 31.05.2017, 05:24
quelle
2

Meine beste Vermutung ist leider, dass das direction-Attribut beim Laden mit jQuerys Traversierungsfunktionen verwechselt werden könnte. Könnte ein Hinweis darauf in diese Repo-Suche sein .

Eine Problemumgehung besteht darin, die Attribut- oder CSS-Regel nach dem Laden der Seite festzulegen:

%Vor%     
The F 30.05.2017 10:12
quelle
0

Das async -Attribut hat das Problem für mich gelöst (nicht so, als wäre noch viel zu parsen, wenn du script am Ende setzt).

Also ersetzen

%Vor%

mit

%Vor%     
Adam 30.05.2017 14:42
quelle
0

Code in onload einfügen:

%Vor% Das Attribut

dir kann in anderen Elementen verwendet werden. Beispiel:

%Vor%     
Mateus Veloso 31.05.2017 15:49
quelle