Nwlapcug.com


Come ottenere la tua pagina Web per precarico prima della visualizzazione

Come ottenere la tua pagina Web per precarico prima della visualizzazione


Come la tecnologia si evolve e visualizzare le pagine Web più velocemente, gli utenti di Internet sono abituati a vedere eventi accadere quando ne facciano richiesta. Per esempio, se i visitatori del sito fa clic su un pulsante denominato "Visualizza immagine", si aspetta l'immagine vengono visualizzati istantaneamente quando cliccato. Un modo per assicurare che questo accade è per precaricare le immagini di pagina Web di grandi dimensioni. Precaricamento assicura che tutti gli oggetti in una pagina sono pronti all'uso quando un utente ha bisogno di accedervi. Precarica immagini della tua pagina Web con l'aggiunta di poche righe di JavaScript al tuo codice HTML.

Istruzioni

1

Aprire una pagina HTML utilizzando blocco note o un editor HTML.

2

Incollare il codice riportato di seguito nella sezione body del documento:

< img src="firstImage.jpg" / >
< img src="secondImage.jpg" / >
< img src="thirdImage.jpg" / >

Questo codice crea tre immagini. Sostituire i nomi di tre immagine - firstImage.jpg, secondImage.jpg e thirdImage.jpg - con i nomi delle immagini sul disco rigido o gli URL delle immagini sul Web.

3

Individuare la sezione di script del documento e incollare il seguente codice JavaScript in quella sezione:

var preLoadedObjects = [
"firstImage.jpg",
"secondImage.jpg",
"thirdImage.jpg"
];

Questo codice crea un oggetto denominato "preLoadedObjects." Questo oggetto contiene i nomi di tutte le immagini che si desidera precaricare. Sostituire i tre nomi sopra indicati con i nomi di tre file utilizzato nella sezione del corpo.

4

Incollare il seguente codice sotto il codice illustrato nella sezione precedente:

per (var i = 0; i < = preLoadedObjects.length; i + +) {
var currentImage = new Image;
currentImage.src = preLoadedObjects [i];
}

Questo codice viene eseguito quando viene caricata la pagina Web. Esso scorre in ogni elemento nell'oggetto preLoadedObjects, crea un'immagine e imposta l'attributo "src" dell'immagine alla posizione dell'immagine.

5

Salvare il documento e visualizzarlo in un browser. Il codice JavaScript viene eseguito e precarica le immagini. Dopo le immagini di carico, viene visualizzata la pagina Web.

Consigli & Avvertenze

  • L'oggetto preLoadedObjects mostrato in questo esempio contiene tre nomi di immagine. Aggiungere altre immagini per questo oggetto desiderati semplicemente aggiungendo nuovi nomi alla lista. Separare ogni nome con una virgola. Non inserire una virgola dopo il nome definitivo.
  • Se si dispone di immagini di grandi dimensioni e si desidera precaricarle, considera visualizzando un messaggio di "Caricamento" sulla tua pagina o mostrando ai visitatori del sito alcune informazioni utili o divertenti. Questo li terrà dal dover visualizzare una pagina vuota mentre caricare le immagini.