Jak wykonać uniwersalną galerię miniturowych zdjęć, które po kliknięciu otworzą się w pełnym rozmiarze


[PHP] Jak wykonać uniwersalną galerię miniturowych zdjęć, które po kliknięciu otworzą się w pełnym rozmiarze?

0x01 graphic

Chcesz stworzyć szybki i automatyczny mechanizm do prezentowania fotek zgromadzonych w katalagu.

0x01 graphic

Nie ma chyba osoby, która nie myślała kiedyś o wykonaniu serwisu z własnymi fotografiami. Tworzenie takiej strony kojarzy Ci się pewnie z mozolnym pisaniem tabel, rozmiarów zdjęcia, poleceń HTML, wykonaniem osobnych plików do pokazania każdej fotografii.

Owszem, niektórzy się z tym męczą, tylko czemu to robią? Mam inne podejście do takich zagadnień. Jedyne co chciałbym zrobić to umieścić dowolną ilość zdjęć (dużych i miniatur) w katalogu, a skrypt sam ma się zatroszczyć o resztę.

I taki skrypt znajdziesz poniżej. Sam pobierze zawartość katalogu, sam skomponuje tabelkę, dzieląc ją na komórki w zależności od tego, ile miniaturek chcesz zobaczyć w jednej linijce. Sam pobierze rozmiary plików graficznych, a po kliknięciu w miniaturę pokaże duże zdjęcie.

Wystarczy do każdego katalogu ze zdjęciami wrzucić plik index.php z poniższym skryptem i już! Reszta Cię nie interesuje. I słusznie, od brudnej roboty są komputery, prawda? No... i programiści piszący takie skrypty...

<center>

<?

$zdjecie = $_GET["zdjecie"];

$linia = 5; // liczba zdjec w jednym wierszu (w jednej linii obok siebie)

if ($zdjecie<>"") {

// duze zdjecie

$rozmiar = GetImageSize("$zdjecie.jpg");

echo "<img src=\"$zdjecie.jpg\" $rozmiar[3]>";

} else {

// miniaturki

$szerokosc = 100/$linia;

$katalog = opendir("./");

while ($plik = strtolower(readdir($katalog))) {

if (($plik<>".")&&($plik<>"..")&&($plik<>"index.php"))

if (!is_dir($plik) and eregi("t",$plik)) $lista[]=$plik;

}

closedir($katalog);

sort($lista);

echo "<table border=1 cellspacing=0 cellpadding=10>";

foreach($lista as $fotka) {

$licznik++;

if ($licznik==1) echo "<tr>";

echo "<td width=$szerokosc% align=center>";

$rozmiar = GetImageSize($fotka);

$fotka = eregi_replace("t.jpg","",$fotka);

echo "<a href=\"?zdjecie=$fotka\"><img src=\"$fotka"."t.jpg\"

border=0 $rozmiar[3]></a>";

echo "</td>";

if ($licznik==$linia) { echo "</tr>"; $licznik=0; }

}

$koniec=$linia-count($lista)%$linia;

if ($koniec<>$linia)

for ($i=0;$i<$koniec;$i++) echo "<td width=$szerokosc%>&nbsp;</td>";

echo "</table>";

}

?>

</center>

Pliki z dużymi zdjęciami, jakie umieszczasz w katalogu, muszą nazywać się 01.jpg, 02.jpg itd. Miniaturki nazywają się tak samo, z tym, że mają dodatkową literkę t, np. 01t.jpg, 02t.jpg. Plików może być dowolna ilość i nie muszą być numerowane po kolei. Katalog może zawierać np. takie pliki:

01.jpg

01t.jpg

05.jpg

05t.jpg

06.jpg

06t.jpg

01t.jpg

09.jpg

09t.jpg

index.php

W skrypcie możesz zmienić ilość miniaturek, jakie przypadają na jeden rząd. W tej chwili jest ich 5, bo gdy obrazki są małe np. 100x75, ładnie mieszczą się na ekranie.

Jeżeli zmienna $zdjecie zawiera jakiś numer, skrypt pokaże duże zdjęcie o podanym numerze, wcześniej pobierając jego rozmiar aby zostało poprawnie wyświetlone na ekranie.

Jeżeli zmienna $zdjecie nie będzie ustawiona, wtedy generowane będą miniaturki na podstawie plików znajdujących się w katalogu. Wcześniej jednak obliczam zmienną $szerokosc, która posłuży mi do ustawienia szerokości kolumn z obrazkami (każda kolumna będzie miała taką samą szerokość).

Z katalogu pobierane są wszystkie pliki zawierające w nazwie literkę t (a więc miniaturki), które następnie są sortowane. Na podstawie listy pobranych plików generowana jest już tabelka z miniaturami.

Tu również pobierane są rozmiary pliku graficznego i jest on podlinkowany w taki sposób, aby po kliknięciu wywołać duże zdjęcie (przekazywany jest parametr zdjecie z numerem dużego zdjęcia do pokazania).

Jeżeli zdjęć w rzędzie jest mniej niż kolumn tabeli, pozostałe pola wypełniane są spacjami. Jak widzisz, wszystko dzieje się automatycznie i znacznie ułatwia pokazywanie niewielkich galerii zdjęć na stronie. Jeżeli zdjęć jest wiele, możesz w osobnych katalogach umieścić po kilkanaście (kilkadziesiąt) i do każdego katalogu dodać skrypt w pliku index.php.

Jeżeli trzymasz numerację kolejną plików, np. (03, 04, 05, 06, itd..) , możesz dodać przyciski "następne zdjęcie", "poprzednie zdjęcie" i "powrót do miniatur". Możesz też dodać opis do zdjęcia, wystarczy umieścić go w pliku z numerem zdjęcia, np. 03.txt, 05.txt - jeżeli plik tekstowy będzie istniał, zostanie wyświetlony pod zdjęciem.

Aby to uzyskać wystarczy tylko lekko zmodyfikować kod wyświetlania dużego zdjęcia:

<center>

<?

$zdjecie = $_GET["zdjecie"];

$linia = 5; // liczba zdjec w jednym wierszu (w jednej linii obok siebie)

if ($zdjecie<>"") {

$pop = sprintf("%02d", $zdjecie-1);

$nas = sprintf("%02d", $zdjecie+1);

if (file_exists("$pop.jpg")) {

echo "<a href=\"?zdjecie=$pop\">&lt;&lt;&lt; poprzednie</a>";

} else {

echo "<font color=gray>&lt;&lt;&lt; poprzednie</font>";

}

echo " &#149; <a href=\"index.php\">powrót do miniatur</a> &#149; ";

if (file_exists("$nas.jpg")) {

echo "<a href=\"?zdjecie=$nas\">następne &gt;&gt;&gt;</a>";

} else {

echo "<font color=gray>następne &gt;&gt;&gt;</font>";

}

echo "<p>";

$rozmiar = GetImageSize("$zdjecie.jpg");

echo "<img src=\"$zdjecie.jpg\" $rozmiar[3]>";

// dodaje opis do zdjęcia z pliku .txt z numerem fotki

echo "<p align=left>";

if (file_exists("$zdjecie.txt")) include("$zdjecie.txt");

} else {

// miniaturki

$szerokosc = 100/$linia;

$katalog = opendir("./");

while ($plik = strtolower(readdir($katalog))) {

if (($plik<>".")&&($plik<>"..")&&($plik<>"index.php"))

if (!is_dir($plik) and eregi("t\.",$plik)) $lista[]=$plik;

}

closedir($katalog);

sort($lista);

echo "<table border=1 cellspacing=0 cellpadding=10>";

foreach($lista as $fotka) {

$licznik++;

if ($licznik==1) echo "<tr>";

echo "<td width=$szerokosc% align=center>";

$rozmiar = GetImageSize($fotka);

$fotka = eregi_replace("t.jpg","",$fotka);

echo "<a href=\"?zdjecie=$fotka\"><img src=\"$fotka"."t.jpg\"

border=0 $rozmiar[3]></a>";

echo "</td>";

if ($licznik==$linia) { echo "</tr>"; $licznik=0; }

}

$koniec=$linia-count($lista)%$linia;

if ($koniec<>$linia)

for ($i=0;$i<$koniec;$i++) echo "<td width=$szerokosc%>&nbsp;</td>";

echo "</table>";

}

?>

</center>



Wyszukiwarka

Podobne podstrony:
Jak zakodować tekst w standardzie quoted printable, który przydaje się podczas wysyłania listów
Jak wykonać formularz z?tą w postaci pól OPTION,?y nie?ło się wybrać?ty z przeszłości(1)
Jak zrobić kilkuwyrazową zajawkę tekstu, który jest znacznie dłuższy i nie może być pokazany
Jak stworzyć formularz, który zapisze?ne do pliku tekstowego,?y potem jego zawartość dołączyć
Jak stworzyć ikonki lub napisy informujące o nowościach na stronie, które same znikną po okreś
MAMO i babciu, Księga życzeń--zrób sam, instrukcja-jak wykonać
Jak wykonać szyk komponentów po lini śrubowej
jak wykonać raport po sprawdzianie
Jak wykonać decoupage, cooooooooooooos
Jak wykonać masaż antycellulitowy
Jak wykonać kable połączeniowe
Jak wykonać tęczowy makijaż Gucci, Makijaż i pielęgnacja
Jak wykonać wstążkową bombkę
Jak wykonać izolację ścian budowanego domu
Mini poradnik Jak wykonac udane zdjecia wakacyjne
jak wykonac sortowanie przez zamiane wymiane wybor algorytm selection sort, PHP Skrypty
Sprawozdania grafy, Jak wykonac sprawozdanie
145 Jak wykonac prace w dwa razy krotszym czasie, Linux, płyty dvd, inne dvd, 1, Doradca Menedzera
Jak zrobić uniwersalne porcjowanie wyników na stronie,?y nie pokazywała się?ła zawartość?zy?nych2

więcej podobnych podstron