Hvordan man laver en simpel Javascript diasshow

JavaScript, også kendt som js, er en web scripting sprog, der bruges til at drive DOM (Document Object Model) elementer. Det er en cross-platform-teknologi til at interagere med objekter i HTML. Ved at åbne forskellige forskellige objekter i HTML, kan du engang klar over en simpel Javascript diasshow med ren Javascript-kode.

Denne artikel vil give dig en enkel Javascript lysbilledshow eksempel således at du kan tilføje et billede slideshow på din hjemmeside. Du kan styre hvad og hvor mange billeder skal medtages, samt diasshowets hastighed. Den eneste overgang toningseffekt bruges til Javascript lysbilledshow. For at få mere kontrol over billedet slideshows, som flere overgangseffekter, slideshow titler, billede hyperlink, osv., er du anbefales at bruge kraftigere slideshow maker ligesom Flash Galleri fabrik, som straks tilføjer iøjnefaldende shows til din hjemmeside.

Du kan også blive en avanceret Javascript-programmør at udvide javascript-koder for en bedre javascript diasshow ved at lære Javascript kursus på W3C.com. Nu se hvordan man opsætter en simpel Javascript lysbilledshow trin for trin.

1 introduktion fra JS diasshow kodeeksempel

Der er ingen grund til at skrive Javascript diasshow kode fra bunden. Her er en Javascript lysbilledshow eksempel (1 kb, zip). Dataoverføre og uddrag til din computer. Vi vil bare ændre det passer til dine behov. Du får en enkelt javascript-slideshow-example.html fil.

2 Skift billede navn, billed bane, js diasshowets hastighed

Lukke op sig hos jeres yndlings teksteditor og ændre det ifølge de noter, der er indeholdt i filen.

• Hvis du vil ændre lysbilledernes varighed, gå til slideShowspeed parameter.
• Hvis du vil føje flere billeder, blot kopiere og indsætte Pic [0] = '1.jpg' linje, og ændre den array nummer og billede filnavn tilsvarende. Hvis dit billede er placeret i en mappe, fx billeder, bruger den tilknyttede sti som Pic [0] = 'images/1.jpg'. Du kan også bruge absolut billede adresse her.

3 integrere Javascript lysbilledshow til din webside

Nu åbne den webside, du vil integrere en Javascript lysbilledshow. Kopier og Indsæt hele < script >-tag til sted mellem < head > og < / hoved >. Så lad siden for at starte lysbilledshowet Javascript, når siden er indlæst ved at tilføje onLoad="javaSlideShow()" tilskriver koden < body >. Endelig gøre Javascript vises på den rigtige position på siden. For at gøre det, bare sætte koden mellem < tabel > og < / table > tags hvor det bør være.

4 gemme og få vist Javascript diasshow

OK, gemme den og preview. Hvis alt går lige, kan du se en Javascript lysbilledshow som dette.