Warten Sie, bis der CSS -Stil der Seite geladen wird. Der HTML -Inhalt wird geladen und dann nach dem Erstellen des Stils anzeigen, wodurch die nachteiligen visuellen Effekte vermieden werden, die durch schrittweise Rendern des Stils nach dem Laden des Inhalts am Anfang und die Verbesserung der Benutzererfahrung verursacht werden.
Die Datei Base-Loading.js-Datei ist der Code wie folgt hinzugefügt
// Erhalten Sie die sichtbare Höhe und Breite der Browser -Seite var _pageHeight = document.documentElement.clientHeight, _PageWidth = document.documentElement.clientwidth; // Berechnen Sie den Abstand zwischen der Ladebox von der oberen und linken Seite (die Breite der Ladebox Is 215Px, die Höhe von 61px). (_PageHeight - 61) / 2: 0, _loadingleft = _PageWidth> 215? (_PageWidth - 215)/2: 0; // Lade der GIF -Adresse var loadimagerul = "/content/loadJS/Bild/laden.gif"; // loadinghtml benutzerdefinierte Inhalte angezeigt, bevor die Seite geladen wurde var 'PX; TOP: 0; Padding-Links: 50px; document.write (_loadinghtml); // Sprechen Sie den Ladezustand zum Ändern des Dokuments. loadingmask.parentnode.removechild (ladernmask);}}
Wenn Sie es verwenden, müssen Sie es nur in den Kopf einführen
@*// JS -Animationseffekt laden*@
<script src = "~/content/ladejs/base-loading.js"> </script>
Der Effekt ist wie folgt: Nach der Einführung erscheint beim Laden von HEML -Inhalten und -Stilen eine Ladeanimation, die nach dem Laden angezeigt wird, um den stotternden Bildschirm allmählich zu vermeiden.
Das Rendering wird abgeschlossen und der Rendering -Bildschirm wird gleichzeitig angezeigt.
Das obige ist das, was der Herausgeber Ihnen vorgestellt hat. Nachdem das EasyUi geladen wurde, wird die Renderung des HTML -Inhalts des Inhaltsstils angezeigt. Ich hoffe, es wird für alle hilfreich sein. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und der Editor wird allen rechtzeitig antworten. Vielen Dank für Ihre Unterstützung auf der Wulin.com -Website!