i-scream.net

Tomato javascript galerija

Evo, polako se i moj blogerski poriv budi sa ovim proljećem. Nagomilalo se previše poluzavršenih tekstova da bi ih ignorirao, pa ću laganim tempom malo pomalo pokušati nastaviti pisati.

šta radim

Uglavnom, posla je bilo brdo u zadnje vrijeme, što je valjda dobro, pa i zbog toga nisam baš bio aktivan blogerski. Evo, čisto da tekst ne bude bez ikakvih linkova, priložit ću jedan link na uradak kojim sam se bavio zadnjih dana… Zahvaljujući fenomenalnom prototype javascript frameworku i scriptaculous animacijskom frameworku za prototype, razvijanje interaktivnih aplikacija (bez nemogućeg flasha) je postalo savršeno lako.
U ovom primjeru, trebalo je složiti galeriju za jednog talentiranog fotografa (uskoro ćemo završiti sajt pa ću stavit i link na njegov novi službeni sajt). Proveo sam 2 dana tražeći neku postojeću js galeriju kojih ima sve više u zadnje vrijeme, no sve su bile ili nedovršene, ili po meni promašene, i na kraju sam ostao sa 2 primjera. Jedan je izuzetno popularni Lightbox, drugi je colouir slideshow. Lighbox je izgleda nastao inspiriran ovim drugim, pa imaju i sličnosti u kodu, što mi je olakšalo posao…

Kako je ispalo
Ispalo je ovako - Luka Baljkas photography. Nije mi se svidilo da su mi thumbnailovi u redovima, što na manjim ekranima razdvaja gornji red od velike slike, pa sam ih sredio koristeći dio treće javaskripte, carousel-a. Kad sam to uspio, trebalo je povezati lighbox tipke za naprijed-natrag sa carouselom, da pomiču thumbnailove da thumbnail aktivne slike uvijek bude aktivan. Zahvaljujući prototype/scriptaculous (moja skraćenica - protaculous :), kod je bio razumljiv pa ni tu nije bilo problema. Malo sam još unaprijedio animaciju promjene veličine velike slike pomoću scriptaculousovog parallel-a, i dobio super galerijicu.

Dodatne ideje
Bilo je problema sa lighboxovim bluranjem aktivnog linka koji nije dozvoljavao da se tabom prođe po svim linkovima, no i to je bilo lako za rješiti, pa je accessibility sad malo bolji (iako bi se na tome još dosta dalo poraditi). Trenutno mi ne rade zvukovi koji rade u colourovom originalu, pa je to neki plan za budućnost. Još jedna stvar koju bih htio staviti je preview thumbnailova od cca 100px veličine na hover malih thumbnailova, također pomoću ajaxa.

Kod nisam dokumentirao jer ću možda još mjenjati razne stvari. :)

Eto, ako netko zna kako poboljšati skriptu, skužio je kakav bug ili nešto, samo vičite. Koristiti ju možete slobodno po potrebi, samo u kod stavit napomenu i link na ovaj blog, malo je zamro u zadnje vrijeme :)….

do skora…

hr.digg|prijavi

2 odgovora na “ Tomato javascript galerija”
  1. Gordan, 15.3.2007. u 19:47

    Prvo ti moram rec da ti je blog tj server danas i jucer u banani. Ucitava se pola sata. A ono sto sam zapravo htio napisat jest da sam nakon 15estak sati proučavanja i testiranja prototypea i jquerya odabrao jquery. Nipošto ne kanim pokrenut jednu od onih “moj tata je jači od tvog” rasprava, i mnogi razlozi koji su me nagnali ka jqueryu su osobne prirode, al kao jedan od “argumenata” moram rec da je sam jquery manji i po nekim generickim testovima brzi. No ponavljam, sve ti ga to dođe na isto :-) Al skidam kapu onom tko je napisao $() funkciju i konačno me riješio pisanja document.getElementById i sličnog crapa.

  2. moko, 13.6.2007. u 7:15

    tnx

Napiši odgovor