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.

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

0 nowych
  #1 22.09.2010 20:15

Dzięki za stronkę :)
Jest tam masa różnych skryptów ;)

wszerad   5 #2 23.09.2010 18:20

Eeee a już myślałem ,że jakiś ciekawy poradnik a tu gotowiec...

skandyn   9 #3 23.09.2010 18:40

@wszerad

Moim skromnym zdaniem to praktyczny wpis.

Pozdrawiam.

Spectator   8 #4 24.09.2010 13:43

Praktyczny, bo osobom nieobeznanym w temacie pokazuje, że takie coś można wykonać nie tylko w flashu, ale w innych technologiach które mimo wszystko są lżejsze i bardziej praktyczne i że nie jest to tak bardzo trudne.

A dobry programista nigdy nie skorzysta z gotowca tylko opracuje własne rozwiązanie wygodne dla niego.

Extraordinarykid   6 #5 26.09.2010 15:35

Popraw tekst - jest kilka błędów ;-)

skandyn   9 #6 26.09.2010 19:30

@Extraordinarykid

OK.

Pozdrawiam.

przemor25   14 #7 09.10.2012 16:55

Czemu usunąłeś tą stronę?
http://skandyn.nstrefa.pl/slideshow/hotzlot.html

skandyn   9 #8 13.10.2012 15:36

Była to już troszeczkę przestarzała stronka, więc ja po prostu zlikwidowałem.

Pozdrawiam.