Ich arbeite mit pace , einem Seitenlader, und es funktioniert einwandfrei. Aber ich kann nicht herausfinden, wie man die gesamte Seite mit Ausnahme der Ladezeile während des Ladens der Seite ausblendet und nach dem Ladevorgang anzeigt. Irgendwelche Ideen?
Ich weiß, dass dies eine Art alter Beitrag ist, aber ich bin gerade auf dieses Problem gestoßen und habe eine andere mögliche Lösung gefunden:)
Versteckt in der Pace-Dokumentation ist Pace.on (). Sie können es verwenden, um an die in den Dokumenten aufgelisteten Ereignisse zu binden:
%Vor%Sie müssen die Seite nicht ausblenden. Erstellen Sie einfach ein festes Element, das Ihre Seite abdeckt, ohne es anzuzeigen, und blenden Sie es dann mit dem Laden der Funktion aus.
%Vor%Und Sie können dem Container eine geladene .gif-Datei oder etwas hinzufügen, das verschwindet, wenn Ihre Seite vollständig geladen ist.
Pace.js fügt dem Körper tatsächlich eine Klasse hinzu. "Pace-running" wird hinzugefügt, während das Tempo aktiv ist, ersetzt durch pace-run, wenn es abgeschlossen ist.
Sie können bestimmte CSS dann:
%Vor%Sie können den obigen Code Ihren Anforderungen entsprechend bearbeiten.
Ich weiß, dass diese Frage ziemlich alt ist, aber ich habe es mit einem kleinen CSS-Block geschafft.
%Vor% Dies verwendet die Klasse, die PACE auf dem Element <body>
platziert, während die Seite geladen wird. Beachten Sie, dass dadurch die Seite bei langen AJAX-Anfragen verschwinden könnte ... Sie könnten das wahrscheinlich umgehen, indem Sie Javascript aktivieren, um zu überprüfen, ob die .pace-running
-Klasse aus dem <body>
-Element entfernt wurde. Wenn Sie jedoch keine XHR-Anfragen haben, sollten Sie damit einverstanden sein.
Versuchen Sie es unter Beispiel einfach und einfach ....
%Vor%
Nach dem setzen dieser CSS basiert auf was auch immer Sie in der ganzen Container ID
erwähnt haben %Vor%FYR:
Tags und Links javascript html loading