JavaScripts knippen en plakken

Op deze website vind je javascripts die je door eenvoudig knippen en plakken aan jouw site kunt toevoegen.

Home   CSS   DHTML   Forum    E-mail   Sitezoeker   Links

THUMBNAILS 3

1. Kopieer deze code en plaats ze in het HEAD-gedeelte van je pagina : <script type="text/javascript"> if(document.images){ huidigBeeld=1; aantalBeelden=5; // hier het aantal beelden invullen afb1 = new Array(aantalBeelden+1); afb2 = new Array(aantalBeelden+1); for(var n=1;n<=aantalBeelden;n++){ afb1[n]=new Image(300,200); //breedte en hoogte van het 'grote' beeld afb1[n].src='../pics/foto'+n+'.jpg';} for(var n=1;n<=aantalBeelden;n++){ afb2[n]=new Image(60,40); // breedte en hoogte van het 'kleine' beeld afb2[n].src='../pics/foto'+n+'.jpg';}} function vorigBeeld(){ if(document.images){ huidigBeeld--; if(huidigBeeld<1) huidigBeeld=aantalBeelden; document.images['klein'].src=afb1[huidigBeeld].src;}} function volgendBeeld(){ if(document.images) { huidigBeeld++; if(huidigBeeld>aantalBeelden) huidigBeeld=1; document.images['klein'].src=afb1[huidigBeeld].src;}} function toonGrootBeeld(){ document.images['groot'].src='../pics/foto'+huidigBeeld+'.jpg'; } </script> 2. Kopieer deze code en plaats ze in het BODY-gedeelte van je pagina : <a href="javascript:toonGrootBeeld();"> <img name="klein" src="../pics/foto1.jpg" width=60 height=40 border=0 alt="Klik voor groter beeld"></a> <a href="javascript:vorigBeeld()">Vorige</a>  <a href="javascript:volgendBeeld()">Volgende</a> <img name="groot" src="../pics/foto1.jpg" width=300 height=200 border=0> 3. Instructies: 3.1. De afbeeldingen moeten allemaal dezelfde naam hebben met een oplopend nummer, bijvoorbeeld: foto1, foto2, foto3, ... 3.2. De afbeeldingen krijgen allemaal dezelfde afmetingen: lees in het script waar je die moet instellen.

Copyright: Het internet is van iedereen, de volledige inhoud van deze site kan door iedereen vrij gebruikt worden.