Hvordan du får din webside til å forhåndslaste Før Viser

Hvordan du får din webside til å forhåndslaste Før Viser


Som teknologien utvikler seg og nettsider vises raskere, Internett-brukere blitt vant til å se hendelser skje når de ber om dem. For eksempel, hvis besøkende klikker på en knapp som heter "Se bilde," de forventer at bildet skal vises umiddelbart når du klikker. En måte å sørge for at dette skjer er å forhåndslaste store Web sider. Forbelastning sikrer at alle objekter på en side er klar til bruk når en bruker trenger for å få tilgang til dem. Preload nettsidens bilder ved å legge til noen få linjer med Javascript i HTML-koden.

Bruksanvisning

1 Åpne en HTML-side med Notepad eller en HTML-editor.

2 Lim inn koden vist nedenfor i dokumentets hoveddel:

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

Denne koden skaper tre bilder. Bytt ut de tre bilde navn - firstImage.jpg, secondImage.jpg og thirdImage.jpg - med navnene på bildene på harddisken din eller nettadressene til bildene på nettet.

3 Finn dokumentet manus delen og lim inn følgende Javascript-kode i denne delen:

Var preLoadedObjects = [
"FirstImage.jpg",
"SecondImage.jpg",
"ThirdImage.jpg"
];

Denne koden skaper et objekt som heter "preLoadedObjects." Dette objektet inneholder navnene på alle bildene du ønsker å forhåndslaste. Bytt ut de tre navnene vist ovenfor med de tre filnavnene du brukte i kroppen delen.

4 Lim inn følgende kode under koden vist i forrige avsnitt:

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

Denne koden kjøres når dine web siden lastes. Det looper gjennom hvert element i preLoadedObjects objekt oppretter et bilde og setter bildets "src" attributt til bildets plassering.

5 Lagre dokumentet og vise den i en nettleser. Javascript-koden kjøres og preloads bildene. Etter bildene belastning, vises websiden.

Hint

  • Den preLoadedObjects objekt vist i dette eksemplet inneholder tre bildenavn. Legg til flere bilder til dette objektet etter behov ved å legge til nye navn på listen. Separer hvert navn med komma. Ikke plasser et komma etter det endelige navnet.
  • Hvis du har store bilder og ønsker å forhåndslaste dem, bør du vurdere å vise en melding "Loading" på siden din eller vise besøkende litt nyttig eller underholdende informasjon. Dette vil holde dem fra å måtte vise en blank side mens bildene laster.