Avtor: -primož- 27.10.09

Večnamenska galerija slik z lightbox efektom.

Galerija v kateri so v vrsto razporejene slike. Med slikami lahko navigirate s pomočjo dveh gumbov za levo in desno ali pa z miškinim kolescem.

Ob kliku na manjšo sliko se z lightboxom odpre večja slika z naslovom in možnostjo navigacije naslednja/prejšnja slika tako, da vam ni potrebno zapustiti lightboxa za premikanje med slikami.

Galerijo lahko uporabite za prikaz vaših izdelkov, za prikaz vašega kataloga ali pa le za vašo galerijo slik.

Navodila za uporabo galerije:

Širino galerije določite s tem, ko poveste, koliko slik naj bo prikazanih na začetku (galerija.htm, vrstica 12).
Galerija za širino ene slike uporabi širino prve slike, zato je najbolje, če so vse slike enako široke.

Ogled dela galerije in razlaga:

href="/ " - pot do velike slike

rel="lightbox[galerija]" - odpre veliko sliko z lightbox efektom (zatemnjeno ozadje).

[galerija] predstavlja ime skupine, da lahko v lightboxu klikate naslednja slika, prejšnja slika.

title=" " - Sem vpišete ime slike, ki bo vidno ob odprtju slike z lightbox efektom

src="/ " - pot do male slike (thumb)

width=" " - širina thumba (če se pri slikah ne bodo videle obrobe poskusite s spreminjanjem tega atributa).

Height=" " - višina thumba

Barvo ozadja lahko spremenite v datoteki styles.css (1. vrstica), ki se nahaja v stylesheet mapi.

V isti CSS datoteki lahko spremenite tudi pot do obeh gumbov (desno, levo, 24. in 25. vrstica).

Če želite le lightbox, brez galerije, ga lahko dobite tukaj: HTML Prenosi.

Komentiraj:

Denis

|23-04-2011 16:52

Zanima me kako bi pa lahko naredil, če bi imel iste slike kot se prikazujejo v galeriji še pod galerijo in ko bi kliknil na sliko, bi se ta slika prikazala v galeriji.

-primož-

|23-04-2011 17:33

Ne razumem točno, kaj misliš.

- kot se prikazujejo v galeriji: misliš tiste slike, ki se prikažejo v lightboxu?

Denis

|23-04-2011 18:13

.......... --
: : | | -- eno izmed slik,
: : -- bi se ta prikazala
.......... | |

Denis

|23-04-2011 18:16

Sm mislu narisat z znaki pa je vse premetalo..vbistvu imel bi zraven te galerije, ko lahko prikazuješ slike s klikom desno ali levo, iste slike in ko bi kliknil na eno imed slik, bi se ta prikazala v galeriji...upam da razumeš kaj mislim.

-primož-

|24-04-2011 07:14

razumem ja.

To bi moral narediti z javascriptom.

Če bi jaz delal to bi naredil verjetno na tak način:
V galeriji bi imel že vse slike a bi vse imele display:none; poleg te galerije (ki bi bila na začetku prazna, ker se ne bi nič prikazalo) bi imel pa te slike na katere bi lahko kliknil (od tukaj naprej jih bom poimenoval slikice). In za te slikice bi spisal javascript funkcijo prikaziSliko(IDslike){}, ki bi ob kliku tisti sliki v galeriji s tem IDjem dolocila display:block;
in to bi moralo pomoje delovati tako, kot ti želiš.

Upam, da sem ti dal neke pointerje za delo, če pa to ni dovolj razumljivo mi piši na trcek.primoz@gmail.com pa ti bom prilimal še kakšne linke do javascript zadev.

Sorodni vodiči
Iframes oz. Okvirji HTML - Oblikovanje besedila Položaj spletne strani znotraj iframea HTML - Osnove Šumniki na spletnih straneh	Javascript ure za spletno stran Glasba na spletni strani Flash v HTML Optimizacija spletnih strani Slika, kot povezava

Moje-Mesto.com

Slovenska spletna stran s HTML, CSS, Windows in Photoshop vodiči.

Facebook oglaševanje

Izdelava spletnih strani

Ustvari.si

Nescafé

!joomlacomment 4.0 Copyright (C) 2009 Compojoom.com . All rights reserved."

Moje-Mesto.com

Oglasi

Naključni HTML vodiči