Seite ausblenden, bis alles geladen ist
Ich habe eine Webseite, die stark macht Verwendung von jQuery.
Mein Ziel ist es zu zeigen nur die Seite, wenn alles fertig ist.
Mit, dass ich vermeiden will, zeigen die lästigen Seiten-rendering für den Benutzer.
Habe ich versucht, diese so weit (#body_holder
ist ein wrapper innerhalb Körper):
$(function(){
$('#body_holder').hide();
});
$(window).load(function() {
$("#body_holder").show();
});
Diese arbeitet völlig in Ordnung, aber versaut das layout.
Das problem ist, dass das verstecken der wrapper stört die anderen jQuery-Funktionen und plugins (zB layout-plugin).
Also denke ich muss es einen anderen trick, dies zu tun. Vielleicht legen Sie ein Bild oder ein div über den ganzen Körper bis zum Fenster.Last aufgetreten ist?
Welche Ansätze nutzen Sie?
EDIT:
Die Lösung hat höchstwahrscheinlich einen anderen Weg als display:none
oder hide()
;
InformationsquelleAutor der Frage Email | 2012-03-03
Du musst angemeldet sein, um einen Kommentar abzugeben.
Sollten Sie versuchen, die Einstellung der Sichtbarkeit auf hidden statt display:none. Einstellung der Sichtbarkeit auf ausgeblendet wird, behalten alle Elemente die Positionen und Dimensionen, also sollte es nicht schaffen, layout-Probleme.
InformationsquelleAutor der Antwort Igor Jerosimić
Hier ist eine jQuery-Lösung für die Suche:
Verstecken Sie den Körper mit css dann zeigen Sie es, nachdem die Seite geladen ist:
CSS:
JavaScript
Wird die Seite gehen von leer, um zu zeigen, alle Inhalte, wenn die Seite geladen ist, werden keine flash-Inhalte, keine Bilder ansehen-Last etc.
InformationsquelleAutor der Antwort hawkeye126
Ihre Frage gültig ist, aber ich würde nicht in eine Praxis zu verstecken oder abdecken der Seite, während die Dinge dreht.
Es hält auch die Benutzer aus zu verstehen, was passiert auf der Seite. Während viele Dinge brauchen, um zu laden, die verschiedenen Teile der Seite sollte der Frühling des Lebens, wie Sie sind geladen. Sie sollten in die Praxis der Verriegelung-Steuerelemente, die nicht bereit sind, vielleicht die Anzeige ein spinner oder eine andere Fortschrittsanzeige über Sie. Oder die Einstellung der
cursor
zuwait
auf laden von Elementen.Dieser hält den Anwender in den loop und erlaubt es ihm zu sehen und zu interagieren mit teilen, wie Sie kommen, statt online, verdecken Sie alle Teile, bis alles fertig ist.
Werden Sie in der Regel laden wollen, die Dinge, die der Benutzer benötigt, der Schnellste Zugang, in der Regel Sachen, über die Falte, die erste. Laden ist eine Priorisierung, die können einfach aufeinander abgestimmt werden Verspricht.
Zumindest sehen die Seite ermöglicht dem Benutzer, um seine Lager und entscheiden, was zu tun ist. Transparent sein.
InformationsquelleAutor der Antwort Mario
Wenn Sie ein div #bodyholder dann können Sie display:none in der CSS für die es dann mit jQuery zu tun:
Ich sehe nicht ein, warum versteckt ein div-Element stören, die mit dem laden nichts, weil alle es bedeutet, dass es versteckt ist. Allerdings, wenn Sie haben viel von jQuery verwendet, dann stellen Sie sicher, wickeln Sie es in der $(document).bereit, das wird stellen Sie sicher, dass das DOM vollständig geladen ist, bevor Javascript ausgeführt wird
Ein weiterer Punkt ist, dass HTML/CSS ist speziell für progressives laden, und wenn Sie es richtig machen, dann können Sie ein schönes progressives laden von Inhalten für Ihre Benutzer. Ich persönlich würde nicht wollen, dass meine Benutzer immer ein weißer Bildschirm für ein paar Sekunden, bis alles geladen wurde. Bewegen Sie Ihr Javascript, um das Ende der Seite, so dass Sie nicht blockieren das laden und abrufen von Inhalten auf dem Bildschirm so schnell wie möglich.
InformationsquelleAutor der Antwort christophmccann