Andere fotogallery
Hallo,
Ik heb een foto website, www.wildnature.nl en de gallery is van lightbox, http://wildnature.nl/?p=galleryvogelsomgeving bijv.
Nou vind ik het wat onhandig en heb ik liever zoiets: http://www.juzaphoto.com/eng/galleries/flora-italy_trebbia_valley.htm
Kan iemand mij daarbij helpen hoe ik dat moet doen? Ben nog een echte beginner dus.
Ik heb een foto website, www.wildnature.nl en de gallery is van lightbox, http://wildnature.nl/?p=galleryvogelsomgeving bijv.
Nou vind ik het wat onhandig en heb ik liever zoiets: http://www.juzaphoto.com/eng/galleries/flora-italy_trebbia_valley.htm
Kan iemand mij daarbij helpen hoe ik dat moet doen? Ben nog een echte beginner dus.
Wat bedoel je precies?
Wil je een andere domeinnaam, of een andere locatie
Toevoeging op 20/01/2011 17:46:07:
(ik ben ook een groentje, maar misschien kan ik je helpen)
Wil je een andere domeinnaam, of een andere locatie
Toevoeging op 20/01/2011 17:46:07:
(ik ben ook een groentje, maar misschien kan ik je helpen)
Wat jij wil, is stukken simpeler dan die light box.
Het is gebaseerd op:
<a href="#004863"/>klik</a>
...
<a name="004863">
<img src="..."/>
Klik je op zo'n link, dan gaatde pagina scrollen tot het punt waarop <a name="004863"> bovenaan je pagina komt.
Het is gebaseerd op:
<a href="#004863"/>klik</a>
...
<a name="004863">
<img src="..."/>
Klik je op zo'n link, dan gaatde pagina scrollen tot het punt waarop <a name="004863"> bovenaan je pagina komt.
Nee hoe de gallery werkt. Nu klik je op een foto en vergroot ie uit, maar ik wil zoals op de gelinkte site dat je gewoon naar beneden scrollt of op de miniatuur klikt en dat ie dan naar die foto zelf 'scrollt'
Dan krijg je dus zo iets:
Dit had je in de broncode kunnen zien, maargoed.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Naamloos document</title>
</head>
<body>
<!-- Bar met miniaturen -->
<div class="miniatuur_bar">
<a href="#00001"><img src="" alt="" /></a>
<a href="#00002"><img src="" alt="" /></a>
<a href="#00003"><img src="" alt="" /></a>
<a href="#00004"><img src="" alt="" /></a>
</div>
<!-- Blok met uitvergrote foto's -->
<div class="content">
<a name="00001"><img src="" alt="" /></a>
<a name="00002"><img src="" alt="" /></a>
<a name="00003"><img src="" alt="" /></a>
<a name="00004"><img src="" alt="" /></a>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Naamloos document</title>
</head>
<body>
<!-- Bar met miniaturen -->
<div class="miniatuur_bar">
<a href="#00001"><img src="" alt="" /></a>
<a href="#00002"><img src="" alt="" /></a>
<a href="#00003"><img src="" alt="" /></a>
<a href="#00004"><img src="" alt="" /></a>
</div>
<!-- Blok met uitvergrote foto's -->
<div class="content">
<a name="00001"><img src="" alt="" /></a>
<a name="00002"><img src="" alt="" /></a>
<a name="00003"><img src="" alt="" /></a>
<a name="00004"><img src="" alt="" /></a>
</div>
</body>
</html>
Dit had je in de broncode kunnen zien, maargoed.
Bedankt voor de reacties! kwam niet in mij op om de bronpagina te bekijken. Maar wat vul je dan hier #00001 in?
de link van waar de afbeelding staat
Gewijzigd op 20/01/2011 19:49:49 door Jasper DS
Ik probeer het maar het lukt nog niet echt, ben echt nog maar net begonnen dus vind het nogal ingewikkeld allemaal. op deze pagina test ik het, http://wildnature.nl/?p=galleryamfibien
Gewoon doen wat we je aanraden en wat nadenken.
Zo-iets dus
Je hebt hier 4 soorten elementen.
1) de thumbnail. Zie dat die de juiste src (source = bron) heeft. kikker, vlinder, vogel naast mekaar
2) De grote foto. Zie dat die de juiste src heeft. kikker, vlinder, vogel onder mekaar
3) Omheen (Een Belg zou hier meestal "rond" zeggen) de thumbnail zet je een link in de trend <a href="#ankerpunt"> (thumbnail) </a>
4) het anker: <a name="ankerpunt"></a> (hier komt dan de grote foto)
Bij jou zie ik maar 1 grote foto, ik zie links met als href de src van een afbeelding (met een # voor); dat is niet de bedoeling.
Zo-iets dus
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
<div class="miniatuur_bar">
<a href="#00001"><img src=".../klein/kikker.jpg" alt="Kikker" /></a>
<a href="#00002"><img src=".../klein/vlinder.jpg" alt="Vlinder" /></a>
<a href="#00003"><img src=".../klein/vogel.jpg" alt="" /></a>
</div>
<!-- Blok met uitvergrote foto's -->
<div class="content">
<a name="00001"></a><img src=".../groot/kikker.jpg" alt="" /> <br/>
<a name="00002"></a><img src=".../groot/vlinder.jpg" alt="" /> <br/>
<a name="00003"></a><img src=".../groot/vogel.jpg" alt="" /> <br/>
</div>
<a href="#00001"><img src=".../klein/kikker.jpg" alt="Kikker" /></a>
<a href="#00002"><img src=".../klein/vlinder.jpg" alt="Vlinder" /></a>
<a href="#00003"><img src=".../klein/vogel.jpg" alt="" /></a>
</div>
<!-- Blok met uitvergrote foto's -->
<div class="content">
<a name="00001"></a><img src=".../groot/kikker.jpg" alt="" /> <br/>
<a name="00002"></a><img src=".../groot/vlinder.jpg" alt="" /> <br/>
<a name="00003"></a><img src=".../groot/vogel.jpg" alt="" /> <br/>
</div>
Je hebt hier 4 soorten elementen.
1) de thumbnail. Zie dat die de juiste src (source = bron) heeft. kikker, vlinder, vogel naast mekaar
2) De grote foto. Zie dat die de juiste src heeft. kikker, vlinder, vogel onder mekaar
3) Omheen (Een Belg zou hier meestal "rond" zeggen) de thumbnail zet je een link in de trend <a href="#ankerpunt"> (thumbnail) </a>
4) het anker: <a name="ankerpunt"></a> (hier komt dan de grote foto)
Bij jou zie ik maar 1 grote foto, ik zie links met als href de src van een afbeelding (met een # voor); dat is niet de bedoeling.
Gewijzigd op 21/01/2011 12:42:25 door Kris Peeters
Super bedankt, het lukt nu wel!




