Slik bytter du en bakgrunn dynamisk på et nettsted

Ved hjelp av CSS og JavaScript kan du dynamisk endre bakgrunnen på nettstedet ditt. Du bruker koden til å endre bakgrunnen hver gang en bruker laster nettstedet inn i en nettleser, og koden fungerer også dersom brukeren oppdaterer nettstedet i nettleservinduet. Du må ha bildene som er brukt i bakgrunnen din, lastet opp til serveren din, så de vises riktig i nettleseren.

1.

Høyreklikk HTML-siden du vil redigere, og velg "Åpne med." Klikk HTML-editoren i listen over programmer.

2.

Legg hvert bilde i et JavaScript-system. For eksempel lager følgende kode en rekke to bilder på webvertserveren:

var bakgrunn = ny Array (); bakgrunn [0] = "/images/bg1.gif"; bakgrunn [1] = "/images/bg2.gif";

3.

Generer et tilfeldig tall. Det tilfeldige tallet brukes til å tilfeldigvis hente et bilde fra gruppen. I dette eksemplet er to bilder lastet, så du må generere et tall mellom 0 og 1. Følgende kode genererer et tilfeldig tall:

var numberGen = Math.floor (Math.random () * 1)

4.

Vis bakgrunnsbildet fra arrayet. Følgende kode kombinerer rekke bilder og tilfeldig tall for å vise et tilfeldig bilde som nettstedets bakgrunn:

document.body.style.background = 'url (' + bakgrunn [numberGen] + ')';