fotoalbum op m'n website

[Svenvanmunster]

Met Dreamweaver ben ik een website aan het maken en nu wil ik graag op de site een mooi fotoalbum plaatsen.

Ik heb al gelezen dat simpleviewer een veel gebruikt programma is, maar ik heb geen idee hoe ik dit in mijn site kan integreren.

Kan iemand mij dit vertellen, als het op een andere manier beter kan is dat ook goed!

Ik heb het html bestand waar ik het album in wil hebben toegevoegd, geen idee of dit van belang is, maar dan staat het er alvast.

In ieder geval al heel erg bedankt!

 

[puppie]

Zelf gebruik ik deze.
kijk maar eens hier en dan bij foto

 

[Svenvanmunster]

oke, je site ziet er leuk uit.

Is dit programma makkelijk te integreren in mijn website en is er ook een handleiding voor?

 

[puppie]

ook ik heb mijn pagina in dreamweaver gemaakt en dit foto album zo er bij in geplakt.
volg de tour en je ziet hoe gemakkelijk het is.

 

[Svenvanmunster]

zeer handig programma en het werkt goed

maar zoals je in het toegevoegde bestand kunt zien, heb ik een site met een menu en dit wil ik graag in beeld houden als de fotos er komen te staan

de foto's zouden dus in het lege gedeelte van de site moeten komen en ik denk niet dat dat met dit programma mogelijk is

 

[JeroenE]

Meer iets als dit?
Vooral het eerste voorbeeld dan.

Greetz : Jeren.

 

[Svenvanmunster]

ja dat is t al meer!

is het mogelijk om jou 3e voorbeeld te verwerken in mijn website dat vind ik wel wat!

Complimenten voor de prachtige fotos trouwens!

 

[JeroenE]

is het mogelijk om jou 3e voorbeeld te verwerken in mijn website dat vind ik wel wat!

Dat kan heel goed ingewerkt worden.

Complimenten voor de prachtige fotos trouwens!

Het is mijn site niet, wel een script dat ik, met hulp van Egel hier op het forum, geschreven heb. De site is van Twan88 hier op het forum.

Zet het volgende in de head van je html-document :

<script language="javascript">
<!--
// geef alle foto's dezelfde naam, met uitzondering van het laatste karakter : foto0.jpg foto1.jpg.....
// Doe hetzelfde met je thumbnails
var curr_pic = 0;
var pics = 26;
// verander die 26 in het aantal foto's die je hebt
function changeImg(num) {
stopShow();
document.getElementById("the_picture").src = "jouwmap/jouwfoto" + num + ".gif";
// verander die "gif" in de juiste extentie
// "jouwmap" verander je in de naam van de map waar jij je foto's online in zet
// zet je die niet in een map, laat dan "jouwmap/" weg
// "jouwfoto" verander je in de naam die jij je foto's geeft, zonder het nummer erachter "foto"
curr_pic = num;
};
function nextImg() {
if (curr_pic == (pics-1)) {
curr_pic = 0;
} else {
curr_pic += 1;
};
document.getElementById("the_picture").src = "jouwmap/jouwfoto" + curr_pic + ".gif";
// verander ook hier die "gif"
// doe ook hier hetzelfde als voorheen met "jouwmap" en "jouwfoto"
};
function prevImg() {
if (curr_pic == 0) {
curr_pic = pics-1;
} else {
curr_pic -= 1;
};
document.getElementById("the_picture").src = "jouwmap/jouwfoto" + curr_pic + ".gif";
// hier nogmaals hetzefde met "gif", "jouwmap" en "jouwfoto"
};
var the_show = "";
function startShow() {
the_show = setInterval("nextImg();",1000);
// verander hier de "1000" in het aantal seconden dat je tussen de foto's wilt, MAAL DUIZEND
// vb : 2 seconden wordt 2000
};
function stopShow() {
if (the_show != "") {
clearInterval(the_show);
the_show = "";
};
};
-->
</script>

In de body van het document komt het volgende :

<table width="100%" height="90%">
<tr valign="middle"><td align="center" width="25%">
<script language="javascript">
<!--
for (var i = 0; i < pics; i++) {
document.write("<img src='jouwmap/jouwthumbnail" + i + ".gif' onClick='return changeImg(" + i + ");' vspace='1' hspace='1'>");
// ook hier verander je "jouwmap", "jouwthumbnail" en "gif" in het juiste
if (i % 4 == 3) document.write("<br>");
// dit geeft 4 thumbnails op een rij, wil je het anders, vb 5, dan verhoog je de 4 en de 3 met 1
};
-->
</script>
</td><td align="center">
<p><img src="jouwmap/jouwfoto0.gif" id="the_picture" height="38px"></p>
<!-- hierboven verander je ook "jouwmap", "jouwfoto" en "gif" in het juiste -->
<p><a href="javascript:prevImg(); stopShow();">Vorige</a>&nbsp;&nbsp;&nbsp;&nbsp;
<a href="javascript:startShow();">Start</a>&nbsp;&nbsp;&nbsp;&nbsp;
<a href="javascript:stopShow();">Stop</a>&nbsp;&nbsp;&nbsp;&nbsp;
<a href="javascript:nextImg(); stopShow();">Volgende</a></p>
</td></tr>
<tr><td align="center" colspan="2"><a href="http://www.jemimaja.be/" target="blank">Jemimaja</a></td></tr>
</table>

Je kan ook gewoon het voorbeeld bekijken, dan bestand opslaan als en je hebt de volledige broncode.
De layout ervan kan je aanpassen zoals je dat zelf wilt. Wil je afbeeldingen ipv "start" en "stop", dan kan dat ook gemakkelijk.
Wil je een andere aanpassing die je zelf niet ziet zitten, roep dan maar even, het is zo gepiept.

Greetz : Jeren.

P.S.: De code staat hier tussen php-tags, maar het is geen php.

 

[Svenvanmunster]

geweldig, dit was precies wat ik zocht!!

Ook een perfecte uitleg, ik heb het album prachtig geintegreerd! En het ziet er netjes uit, alleen pakt hij de foto's niet..

Ik heb alles zo aangepast als in de uitleg staat vermeld, de map heet 'images', de bestanden heten allemaal 'foto' (lopend van 0 t/m 8) en de thumbnails staan onder de naam 'fotothumbnail' en lopen ook van 0 t/m 8. Maar als ik nu de site als preview in mijn browser open dan zie ik slechts kruisjes terwijl op deze plek toch echt de foto's moeten staan zoals deze aanwezig zijn in de map images.

Rechtermuisknop/eigenschappen op zo'n kruisje geeft aan bij adres:

file:///C:/Documents%20and%20Settings/Sven/Mijn%20documenten/Site's/Noabers-Online/template002/html/images/fotothumbnail0.jpeg

en het bestand fotothumbnail0.jpeg is wel aanwezig in deze map.

Vergeet ik een stap of ligt het probleem ergens anders?

 

[JeroenE]

file:///C:/Documents%20and%20Settings/Sven/Mijn%20documenten/Site's/Noabers-Online/template002/html/images/fotothumbnail0.jpeg

Verander de bovenstaande regel eens in :

images/fotothumbnail0.jpeg

Misschien is het niet "jpeg", maar "jpg".

Greetz : Jeren.

 

[Svenvanmunster]

Aah, inderdaad!

Windows noemt het een JPEG afbeelding, maar de extensie is JPG.

Ga het gelijk veranderen, dankje voor de snelle reactie!

 

[Svenvanmunster]

en ja hoor!

Soms is het simpeler dan je denkt!! He helemaal geweldig, het staat er mooi op!!

Bedankt voor de tophulp!!