Sorry als het zo overkomt, maar zo was het niet bedoeld hoor.
Ik geef alleen maar aan, dat het een stuk beter werkt om zelf te leren hoe iets werkt (eventueel door te kijken) dan om het zomaar te knippen en plakken zonder er verder over na te denken.
Je schrijft dat je op die manier al aardig wat hebt geleerd. Ik begrijp nu, dat je dus eerder op zoek bent naar assistentie bij het leren, dan assistentie bij het 'jatten'. Dat vind ik een goede zaak en ik ben heus niet te beroerd om daarbij te ondersteunen.
Naar mijn idee zou je zo'n 'wisselend beeld' als volgt moeten opbouwen:
<div id='plaatjeshouder'>
<div class='plaatje' id='plaatje1'><img ......></div>
<div class='plaatje' id='plaatje2'><img ......></div>
<div class='plaatje' id='plaatje3'><img ......></div>
....
</div>
In css geef je natuurlijk de plaats, grootte etc. van de plaatjeshouder en de individuele plaatjes in. Verder stel je in eerste instantie alle plaatjes behalve de eerste op 'onzichtbaar':
.plaatje { visibility: hidden; }
#plaatje1 { visibility: visible; }
Daarna moet je met Javascript een functie maken die regelmatig wordt aangeroepen (bijvoorbeeld elke 5 seconden ofzo). Die functie weet welk plaatje actief is, hij zet die uit en de volgende aan.
Het regelmatig aanroepen doe je met de Javascript functie setInterval. Zoek daar even op en je vindt wel hoe het werkt.
Het wisselen zou ik ongeveer zo doen:
var aantalPlaatjes = 3; // bijvoorbeeld. dit stel je in bij het inladen van de pagina, dus niet in de functie
var huidigPlaatje = 1;function wisselPlaatje() {
// zet huidig plaatje uit
var plaatje = document.getElementById('plaatje'+huidigPlaatje);
plaatje.style.visibility = 'hidden';
// door naar volgend plaatje
huidigPlaatje++;
if (huidigPlaatje>aantalPlaatjes) huidigPlaatje=1;
// zet deze aan
plaatje = document.getElementById('plaatje'+huidigPlaatje);
plaatje.style.visibility = 'visible';
}
Het lijkt me dat dat voldoende basis moet zijn om er wat van te maken als je voor de rest enige HTML en Javascript kennis hebt. Succes.
Gast
