Otvaranje slika na sajtu ali na drugaciji nacin...

1

Otvaranje slika na sajtu ali na drugaciji nacin...

offline
  • Pridružio: 29 Jun 2007
  • Poruke: 104

Imam jedno pitanje...
Kako da namestim na sajtu da mi se slike otvaraju kao na ovom linku (http://www.eurovision.tv/page/photos?gal=585 (klik na neku sliku))



Registruj se da bi učestvovao u diskusiji. Registrovanim korisnicima se NE prikazuju reklame unutar poruka.
offline
  • PHP developer
  • Pridružio: 22 Mar 2006
  • Poruke: 3760
  • Gde živiš: 127.0.0.1

To je mali JavaScript za galerije, i veoma lako se podesava... Idi na google, pa pretraga na temu "LightBox 2" Smile



offline
  • Pridružio: 29 Jun 2007
  • Poruke: 104

Rastafarii ::To je mali JavaScript za galerije, i veoma lako se podesava... Idi na google, pa pretraga na temu "LightBox 2" Smile
mycity.rs/must-login.png
Evo ovo sam skinuo.

Kako ubacujem tu skriptu
i jel sve treba da se uploaduje???

offline
  • Pridružio: 22 Jun 2006
  • Poruke: 409

Treba. Na sajtu lightbox-a piše kako se ubacuje:
http://www.huddletogether.com/projects/lightbox2/#how

offline
  • Pridružio: 29 Jun 2007
  • Poruke: 104

Wraith ::Treba. Na sajtu lightbox-a piše kako se ubacuje:
huddletogether.com/projects/lightbox2/#how


Sve bi to bilo lepo kad bi ja to znao da prevedem.

Moze li neko u kratkim crtama da kaze kako to da uradim...

offline
  • Pridružio: 22 Jun 2006
  • Poruke: 409

Dodaš ovo u <head>:

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

ubaciš i ovaj CSS fajl:

<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

Normalno promeniš putanju do css-a i js fajlova. Posle toga proveri u CSS-u (lightbox.css) da li su putanje do fajlova dobre:
prev.gif
next.gif

U fajlu lightbox.js proveri da li su dobre putanje do:
loading.gif
close.gif

Ako nisu, promeni ih.

<a href="nekaslika.jpg" rel="lightbox" title="Ovde ide tekst koji će se videti ispod slike"><img src="putanja_do_umanjene_verzije_slike.jpg" width="100" height="40" alt="" /></a>

Ovo je primer korišćenja Lightbox-a, potrebno je da u <a> tag linka koji vodi do slike dodaš rel="lightbox"

Ovaj kod:<img src="putanja_do_umanjene_verzije_slike.jpg" width="100" height="40" alt="" /> je umanjena verzija slike, koji sam praviš, i nije obavezna, umesto nje može i bilo koji tekst, width i height unosiš u odnosu na veličinu sličice koju si napravio, a alt je opis slike.

Ako želiš da grupišeš slike u kategorije, onda to uradiš ovako:
<a href="slika1.jpg" rel="lightbox[kategorija]">Tekst koji se prikazuje</a> <a href="slika12.jpg" rel="lightbox[kategorija]">Tekst koji se prikazuje</a> <a href="slika13.jpg" rel="lightbox[kategorija]">Tekst koji se prikazuje</a>

Normalno, kao što sam rekao, umesto teksta može i umanjena slika. Nadam se da sam pomogao Smile

offline
  • Pridružio: 01 Apr 2006
  • Poruke: 658
  • Gde živiš: Kruševac

koliko sam primetio ovo je joomla, a da li neko zna kako se zove ova galerija ili ako neko zna slicnu neka ostavi ovde link.

offline
  • Pridružio: 22 Jun 2006
  • Poruke: 409

Kao što je Rastafarii već rekao u ovom postu, galerija se zove LightBox 2. Više ne govorim. I zašto misliš da je ovo joomla? Jeste da i u njoj možeš koristiti ovu galeriju ali i dalje ne kapiram...

offline
  • Pridružio: 29 Jun 2007
  • Poruke: 104

Wraith ::Dodaš ovo u <head>:

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

ubaciš i ovaj CSS fajl:

<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

Normalno promeniš putanju do css-a i js fajlova. Posle toga proveri u CSS-u (lightbox.css) da li su putanje do fajlova dobre:
prev.gif
next.gif

U fajlu lightbox.js proveri da li su dobre putanje do:
loading.gif
close.gif

Ako nisu, promeni ih.

<a href="nekaslika.jpg" rel="lightbox" title="Ovde ide tekst koji će se videti ispod slike"><img src="putanja_do_umanjene_verzije_slike.jpg" width="100" height="40" alt="" /></a>

Ovo je primer korišćenja Lightbox-a, potrebno je da u <a> tag linka koji vodi do slike dodaš rel="lightbox"

Ovaj kod:<img src="putanja_do_umanjene_verzije_slike.jpg" width="100" height="40" alt="" /> je umanjena verzija slike, koji sam praviš, i nije obavezna, umesto nje može i bilo koji tekst, width i height unosiš u odnosu na veličinu sličice koju si napravio, a alt je opis slike.

Ako želiš da grupišeš slike u kategorije, onda to uradiš ovako:
<a href="slika1.jpg" rel="lightbox[kategorija]">Tekst koji se prikazuje</a> <a href="slika12.jpg" rel="lightbox[kategorija]">Tekst koji se prikazuje</a> <a href="slika13.jpg" rel="lightbox[kategorija]">Tekst koji se prikazuje</a>

Normalno, kao što sam rekao, umesto teksta može i umanjena slika. Nadam se da sam pomogao Smile


Hvala! Laughing

offline
  • PHP developer
  • Pridružio: 22 Mar 2006
  • Poruke: 3760
  • Gde živiš: 127.0.0.1

Wraith ::Kao što je Rastafarii već rekao u ovom postu, galerija se zove LightBox 2.

Doduse postoji i milion klonova (npr Lytebox, LightWindow, ThickBox) - ali u svakom slucaju sve je to jedno te isto, sa sitnim varijacijama.

Ko je trenutno na forumu
 

Ukupno su 852 korisnika na forumu :: 5 registrovanih, 1 sakriven i 846 gosta   ::   [ Administrator ] [ Supermoderator ] [ Moderator ] :: Detaljnije

Najviše korisnika na forumu ikad bilo je 3466 - dana 01 Jun 2021 17:07

Korisnici koji su trenutno na forumu:
Korisnici trenutno na forumu: Dorcolac, Posmatrac77OKB, shaja1, Tila Painen, zziko