Strona używa cookies (ciasteczek). Dowiedz się więcej o celu ich używania i zmianach ustawień. Korzystając ze strony wyrażasz zgodę na używanie cookies, zgodnie z aktualnymi ustawieniami przeglądarki.    X

JavaScript Slideshow

W kolejnym moim wpisie chciałbym opisać jak można zrobić prostym sposobem efektowny i automatyczny pokaz slajdów na stronie internetowej. Nasze zdjęcia będą wyświetlane za pomocą języka JavaScript a dokładniej skryptu Drop-in Slideshow Script.

Przykładowy screen

Tworzymy

Na początku pobieramy przygotowany przez ze mnie pakiet ze skryptami tutaj i rozpakowujemy archiwum. Następnie dodajemy skrypty do wybranej przez nas strony znajdujące w się dwóch plikach tekstowych: krok 1 w sekcji head.txt (wklejamy w sekcji head), krok 2 w sekcji body.txt (wklejamy w sekcji body) i plik dropinslideshow.js wgrywamy na serwer. Teraz musi odpowiednio przygotować nasze zdjęcia, czyli, w jakiej rozdzielczości mają być wyświetlane na stronie internetowej. Przykładowo fotki mogą mieć rozdzielczość ok. 500 x375 pikseli a rozmiar możemy zmienić za pomocą programu Fotosizer.

r   e   k   l   a   m   a

Edytujemy skrypt w sekcji {body}

{script type="text/javascript"}

//Define Image Array. Syntax: ["image_path", "url_destination", "url_target"]
var myimages=new Array()
myimages[0]=["fotki/1.jpg"] - ścieżka do obrazka
myimages[1]=["fotki/2.jpg"]
myimages[2]=["fotki/3.jpg"]

//Create new drop-in slideshow
//Syntax: new dropinslideshow(image_array, slideshow_width, slideshow_height, delay_before_rotation)
new dropinslideshow(myimages, 500, 400, 3000) - szerokość i wysokość obrazka, opóźnienie pokazu

{/script}

Pokazujemy

Przykładowy pokaz slajdów moje zdjęcia z HotZlotu 2010 click

Moja ocena

Pokaz slajdów wykonany przy użyciu skryptu Drop-in Slideshow Script to klasyczny na zasadzie spadających obrazków w dół sposób na opublikowanie naszych fotek w Internecie. Ciekawą funkcją jest możliwość zatrzymania pokazu poprzez najechanie kursorem myszki na dane zdjęcie. Moim zdaniem prezentacja zdjęć tym sposobem to efektowny gadżet na naszej stronie internetowej.

Pozdrawiam. 

Komentarze