Otwieranie zdjęć z miniaturek

Dla specjalistów Webmastering
#1

Witam,

zapewne pytanie jest banalne ale robię na szybko stronkę dla koleżanki w htmlu z szablonu opartego na css, nie robiłem żadnej stronki od dawna a mam dość mało czasu dlatego proszę o pomoc bo na razie nie zdołałem niczego znaleźć.

Chodzi mi o zrobienie na stronie galerii, żeby pokazywały się miniaturki zdjęć a po kliknięciu żeby wyskakiwało powiększone zdjęcie, nie w nowym oknie tylko po prostu samo zdjęcie.

Żeby nie było wątpliwości - chodzi mi o taki efekt - http://iness-rychlik.com/portfolio.html

Z samymi miniaturkami sobie poradzę, nie wiem tylko jak zrobić żeby po kliknięciu wyskakiwało zdjęcie w taki właśnie sposób.

Pozdrawiam

#2

Lightbox

akurat ten na tamtej galerie to lightbox 1 ale ja polecam dwójkę :slight_smile:

http://www.huddletogether.com/projects/lightbox2/

#3

Wielkie dzięki, świetny ten lightbox :slight_smile:

Niestety pojawiły się 2 problemy z którymi nie wiem jak sobie poradzić:

  1. dookoła miniaturki przypisanej do lightboxa pojawia się ramka i nie wiem jak ją usunąć (kiedy wrzucam zdjęcie bez lightboxa ramki nie ma)

  2. kiedy otwieram zdjęcie ze strony index.html wszystko jest w porządku, jednak ma być podstrona galeria.html i tam pojawia się problem - wszystko dobrze się otwiera, tylko nie wyskakuje przycisk ‘close’, kiedy najeżdżam myszką na miejsce, gdzie powinien być strzałka zamienia się w łapkę i po kliknięciu okienko się zamyka, ale obrazek z napisem ‘close’ się nie pojawia.

To fragment kodu powiązanego z lightboxem:

Ten sam kod (tylko bez …/) w index.html działa, dlaczego tak się dzieje?

Pozdrawiam i proszę o wyrozumiałość, robię coś takiego pierwszy raz :slight_smile:

#4

  1. Zapewne musisz w stylach CSS wstawić info o linkach, bo to link jest w sumie do tego zdjęcia, żeby nie wyświetlało się żadne tło czy coś tam :wink:

  2. Pewnie masz coś źle z drzewem katalogów, jeżeli galeria.html jest w innym katalogu musisz jeszcze raz przekopiować grafiki.

Jeżeli nadal będzie źle wrzuć stronkę na jakiś hosting i daj linka.

#5

Nie udało mi się tego naprawić, więc oto ta stronka:

http://www.wrzucaj.com/424313

Jest w zasadzie kopią tej, do której dałem linka wcześniej, ale takie było założenie i nie będzie ona publikowana w internecie :slight_smile:

Pozdrawiam

#6

Ok skopiuj sobie katalog images do podstrony i będzie działać :slight_smile:

#7

Rzeczywiście… proste rozwiązanie, dzięki :slight_smile:

A jeszcze z tymi zielonymi ramkami wokół zdjęć da się coś zrobić? Bo niestety nadal nie potrafię ich zlikwidować

Edit:

Zlikwidowałem ramki, szukałem przyczyny w pliku css a okazało się że po ścieżce do miniaturki w pliku index.html wystarczy dopisać border=0 :slight_smile:

#8

Lepiej w css, dopisać

img {

border: 0;

}