lo0ol [ Jónior ]
Galeria - html + js
Zrobiłem szablon galerii korzystający ze skryptu js "lightbox". Mam mały problem z ułożeniem tego. Otóż chodzi mi o to, aby niezależnie od prawdziwych rozmiarów zdjęcia ... było ono równo skalowane i ładnie dopasowywane do tabeli w której się zawiera, zachowując proporcję. Piszę, aby znaleźć pomoc w zrobieniu tego. Jeżeli ktoś byłby w stanie mi pomóc na scenie forum lub na GG 4227383 to będę wielce wdzięczny. Poniżej wrzucam kod tabeli zawierającej galerię, a obok skrina całości (na załączonym obok obrazku wszystko jest OK, ponieważ tabela zawiera takie same obrazki ... jeżeli wrzucę jakiś o innych rozmiarach to tabela sie krzaczy).
____________________________________
<table border="0" height="500" width="500">
<tr align="center" valign="middle">
<td><a href="images/lo0ol.jpg" rel="lightbox[roadtrip]"><img src="images/lo0ol.jpg" width="80%" height="80%"></a></td>
<td><a href="images/lo0ol.jpg" rel="lightbox[roadtrip]"><img src="images/lo0ol.jpg" width="80%" height="80%"></a></td>
<td><a href="images/lo0ol.jpg" rel="lightbox[roadtrip]"><img src="images/lo0ol.jpg" width="80%" height="80%"></a></td>
</tr>
<tr align="center" valign="middle">
<td><a href="images/lo0ol.jpg" rel="lightbox[roadtrip]"><img src="images/lo0ol.jpg" width="80%" height="80%"></a></td>
<td><a href="images/lo0ol.jpg" rel="lightbox[roadtrip]"><img src="images/lo0ol.jpg" width="80%" height="80%"></a></td>
<td><a href="images/lo0ol.jpg" rel="lightbox[roadtrip]"><img src="images/lo0ol.jpg" width="80%" height="80%"></a></td>
</tr>
<tr align="center" valign="middle">
<td><a href="images/lo0ol.jpg" rel="lightbox[roadtrip]"><img src="images/lo0ol.jpg" width="80%" height="80%"></a></td>
<td><a href="images/lo0ol.jpg" rel="lightbox[roadtrip]"><img src="images/lo0ol.jpg" width="80%" height="80%"></a></td>
<td><a href="images/lo0ol.jpg" rel="lightbox[roadtrip]"><img src="images/lo0ol.jpg" width="80%" height="80%"></a></td>
</tr>
</table>
Regis [ ]
A jak sobie wyobrazasz dzialanie czegos takiego? Jesli jedno zdjecie ma 100 x 300 pikseli, a drugie 300 x 100 to co ma sie z nimi stac? Bo nie bardzo rozumiem jak bys chcial takie cos osiagnac (chodzi mi o sama koncepcje - jak to by Twoim zdaniem mialo dzialac).
lo0ol [ Jónior ]
Parametry img (width i height) wyrażane są (wg mojej twórczości) procentowo i 80% nie jest 80% pierwotnych rozmiarów zdjęcia, a komórki tabeli. Wrzucenie foty o innych proporcjach wysokości do szerokości powoduje coś takiego jak na obrazku obok. Chciałbym, aby obrazki zachowywały swoje WŁASNE proporcje, a nie dostosowywały się do tego najdłuższego/najwyższego w danej kolumnie, czy też wierszu. Przy czym nie powinny psuć rozmiarów innych zdjęć.
Mam nadzieje, że teraz wiadomo o czym marzę. :d
Siepet [ Hawkeye ]
Chcesz zrobić po prostu miniaturki zdjęcia XX, które ma 80% width i height oryginalnego rozmiaru?
lo0ol [ Jónior ]
Nie :p chcę, aby miniatury obrazków zachowywały SWOJE proporcje i wpasowywały się do tabeli.
Czyli na przykład:
OBRAZEK 1
Oryginał: 1000x500
Miniatura: 200x100
OBRAZEK 2
Oryginał: 800x1000
Miniatura: 160x200
OBRAZEK 3
Oryginał: 3000x2000
Miniatura: 200x133
_____________________
Czyli, aby szerokość i wysokość była skalowana proporcjonalnie, a powiedzmy maksymalny rozmiar wynosił np 200. To moja własna idea ... ale jeżeli ktoś da mi pomysł na załatwienie tego w inny sposób, który w efekcie da ładnie wyglądającą galerię (z tą grafiką) to chętnie ulegnę.
maviozo [ Man with a movie camera ]
Sprawdzasz który bok jest dłuższy i wg niego dopasowujesz rozmiar.
Zakładamy, że optymalny rozmiar obrazka to 100x100.
400x300 = 400/100 = 4
300 / 4 = 75
czyli rozmiar miniaturki to 100x75
I dopasowane.
200x500 = 500 / 100 = 5
200 / 5 = 40
czyli rozmiar miniaturki to 40x100
Coś takiego?
lo0ol [ Jónior ]
Tak, dokładnie o to mi chodzi tylko ... o ile w językach programowania typu cpp, vb bym sobie poradził z takim skalowaniem bez problemu, to nie mam pojęcia jak to zrobić w htmlu.
maviozo [ Man with a movie camera ]
W gołym htmlu tego raczej nie zrobisz.
lo0ol [ Jónior ]
A jest jakieś inne rozwiązanie tego problemu (pomijając ustawianie wymiarów ręcznie przy każdej miniaturze)? Jedynym moim warunkiem jest: "aby ładnie wyglądało".
maviozo [ Man with a movie camera ]
Niestety, przygotowanie dwóch plików: jeden oryginalny, drugi zmniejszony (miniaturka) [poza tym, to bardzo przyśpieszy działanie, bo wczytasz 9x25kb a nie 9x4mb]. Można to zautomatyzować w XnView na przykład, jeśli masz masę obrazków.
lo0ol [ Jónior ]
I to jest program, który rozwiązał mój problem. :p Dzięki.