Hvordan lage en Mini Show

Å gjøre en mini lysbildefremvisning kan være en effektiv måte å vise lysbilder av grafikk eller bilder på ditt nettsted uten å ta opp mye plass. For å lage en lysbildefremvisning på din webside, bør du ha en grunnleggende nivå av forståelse for HTML og Javascript koding. Men du trenger ikke å være en ekspert.

Bruksanvisning

1 Logg inn på din webserver.

2 Preload bildene du vil bruke i lysbildefremvisningen, slik at de er tildelt URLer på serveren. Prosessen du følge for å gjøre dette varierer sterkt avhengig av nettserverens verktøy. Vanligvis innebærer dette klikke en "Last opp" -knappen, deretter surfer datamaskinen for bildene du vil laste opp. Etter å finne hvert bilde, klikker du på en "Publiser" -knappen for å gjøre hvert bilde levende og gi det en filbane. Lagre disse filbaner til et sted der du enkelt kan få tilgang til dem.

3 Åpne HTML-siden der du vil vise mini lysbildefremvisning.

4 Sett inn følgende kode på siden:

<Html>

<Head>

<Script type = "text / javascript">

<! -

Var image1 = new Image ()

image1.name = "slide" width = "100" height = "56" />

<Script>

<! -

// Variabel som vil øke gjennom bildene

Var trinn = 1

funksjon SlideIT () {

// Om nettleseren støtter ikke bildeobjekt, exit.

if (! document.images)

komme tilbake

document.images.slide.src = eval ( "image" + trinn + ". src»)

if (trinn <3)

trinn ++

ellers

trinn = 1

// Samtalefunksjonen "SlideIT ()" hvert 2,5 sekund

setTimeout ( "SlideIT ()", 2500)

}

SlideIT ()

// ->

</ Script>

</ Body>

</ Html>

5 Sett begge tilfeller av "firstimage.jpg" med filbanen til bildet du ønsker å vise først. Dette er den eneste bilde som er oppført i den koden to ganger. De andre bildene er oppført en gang.

6 Bytt ut "secondimage.jpg" og "thirdimage.jpg" forekomster med filbaner for de andre bildene du vil ha med i lysbildefremvisningen.

Hint

  • Hvis du vil legge til flere bilder i lysbildefremvisningen, sette inn følgende kode etter det siste bildet som er oppført i kode:
  • Var image4 = new Image ()
  • image4.src = "fourthimage.jpg"
  • Endre navnet på bildet til riktig fil banen etter behov og følge denne prosessen for å legge til enda flere bilder til showet.