Ich arbeite an einem Projekt, bei dem eine ganze Menge jQuery läuft. Wenn ich also auf die Seite gehe, kann ich sehen jQuery läuft (zB $.button() Elemente auf der Seite erscheinen immer noch als normale html Elemente, bevor jQueryUI geladen wird: S), so dass es anfänglich hässlich aussieht THEN Sobald alle JS geladen und ausgeführt sind, sieht es "nett" aus.
Es ist nicht nur ein Vorladen von Bildern oder was auch immer, ich möchte den jQuery-Code ausführen, aber ihn vor Besuchern verstecken, so dass er nach dem Öffnen der Seite sofort "nett" aussieht ODER einen schwarzen Bildschirm anzeigt "Loading ..." bis die jQuery beendet ist.
Sehen Sie sich hier an: Ссылка , obwohl ich mir nicht sicher bin, ob das Javascript tatsächlich ausgeführt wird, bevor es angezeigt wird, aber es zeigt sich die Grundidee, einen dunklen Bildschirm mit der Aufschrift "Loading ..." zu haben. Ich vermute, dass das in großen Web-Apps wie SlideRocket passiert obwohl es Flash verwendet ...: S
Sie haben die Frage selbst beantwortet. Haben Sie einen Ladebildschirm, der die Seite versteckt, bis alle jQuery ausgeführt wurde.
Versuchen Sie etwas wie folgt.
Dies steht ganz oben auf Ihrer Seite:
%Vor%Hier ist Ihre jQuery:
%Vor%Legen Sie alle Ihre jQuery, die Sie "vorgeladen" haben möchten, in diese:
%Vor%oder alternativ nicht der gesamte jQuery-Code in diesem Wrapper. Setzen Sie stattdessen Ihre jQuery-DOM-Änderungen in ein
%Vor%und dann einen Wrapper für alle Ihre Website-Inhalte.
%Vor%und setzen Sie die Anzeige in Ihrem CSS auf none
%Vor%und dann mit dem Fenster laden wie früher
%Vor%Ich hatte ein ähnliches Problem mit einem Artefakt, das während des Ladens von Seiten in IE8 kurz auftauchte. Die Lösung, die ich verwendete, war, die Sichtbarkeit des Containers in Zeile 1 des CSS zu verdecken. Dann zeigte das Element am Ende der JQuery-Datei. Wenn die CSS und JQuery beginnen zu streiten, wird das Element nicht angezeigt, bis das Argument aufgelöst ist.
Die Antwort von Christopher ist wahrscheinlich die Art, wie FilamentGroup es macht. Sie können Javascript "vorinstalliert" haben, es lädt inline mit dem Rest der Seite, und aufgrund dessen in der Regel größer als der Rest der Seite dauert länger zum Download. Sie können JavaScript nicht zuerst laden, so funktioniert es nicht.
Das Prinzip, um es zum Laufen zu bringen, besteht jedoch darin, Ihre Seite aus der CSS-Ansicht auszublenden (oder mit Inline-Styles, da das CSS noch geladen werden muss), sobald alles in Javascript fertig ist, alles wieder zu zeigen. Wenn Sie bemerken, dass eine Lücke zwischen der Seite, die angezeigt wird (nichts), und dem Javascript-Laden, das auf FilamentGroup angezeigt wird, besteht. Das ist, weil sie die Seite verstecken, lädt der Javascript-Lader, und sobald der Rest des Javascript beendet ist, verbirgt es den Lader und zeigt die Seite an.
Tags und Links javascript html jquery jquery-ui