nog een script gezocht

[Stormbringer]

Ik zoek een script waarbij een afbeelding éénmalig veranderd in een andere afbeelding.
Met de mogelijkheid om seconden in te stellen wanneer de verandering gebeurd.
De tweede afbeelding moet vervolgens gewoon blijven staan.

Wie oh wie??? Roept u maarrrrr!

 

[Robin S]

Een eenmalige verandering na een bepaalde tijd doe je met setTimeout. Het veranderen van een afbeelding doe je door het veranderen van de source. Daarvoor moet je eerst een referentie naar de afbeelding te pakken krijgen. Dat kan bijvoorbeeld door de functie getElementById, of met behulp van de jQuery-library, mocht je daar toch al gebruik van maken.

[JS](function() {

setTimeout(function() {
var img = document.getElementById("myImage");
img.src = "img/newImage.jpg";
}, 5000); //5000ms = 5sec

})();[/JS]

Let op: als newImage.jpg een groot bestand is en nog niet in je cache zit, kan 't net iets langer duren dan 5 seconden voordat 't ding geladen is. Da's weer op te lossen met image-preloading.

 

[Supersnail]

<img src="afbeelding1.jpg" id="plaatje">
<script type="text/javascript">
setTimeout(function(){document.getElementById('plaatje').src = 'afbeelding2.jpg';}, 1000);
</script>

Zoiets? Waarbij je afbeelding1.jpg en afbeelding2.jpg moet vervangen door de juiste namen van de afbeeldingen en 1000 door de tijd (in milliseconden) na hoeveel tijd de afbeelding vervangen moet worden.

[edit]Robin S was me voor[/edit]

 

[Stormbringer]

re:

Ik heb de tweede genomen ( de eerste werkt niet) en dit gedaan:

<IMG SRC="indexheader.JPG" HEIGHT="480" WIDTH="720" BORDER="0">
<script type="text/javascript">
setTimeout(function(){document.getElementById('plaatje').src = 'PS1.JPG';}, 1000);
</script>

Werkt echter ook niet. Wellicht heb ik iets fout gedaan...?

 

[MouNtant]

Hallo!

Het eerste script werkt ook volgens mij. Ik heb dit niet getest, maar het feit dat het bij jouw niet werkt kan eraan liggen dat je jquery niet heb je geimporteerd?
De functie die hij gebruikt allereerst heet de ready functie( ik bedoel: (function() {})(); ) Deze geeft aan wanneer de dom beschikbaar is voor manipulatie. Dit is een jquery functie.

Ik heb alleen gekeken naar de tweede oplossing. Deze werkt bij jouw niet omdat je plaatje geen id heeft, zie het dikgedrukte hieronder. Hij kan dus niet jouw plaatje uit de dom pakken met die document.getElementById. Deze functie zegt eigenlijk al wat hij doet .

<IMG id="plaatje" SRC="1392953161.JPG" HEIGHT="480" WIDTH="720" BORDER="0">
<script type="text/javascript">
setTimeout(function(){document.getElementById('plaatje').src = 'Hoofdindeling_processen.PNG';}, 1000);
</script>

Let niet op de plaatje namen ik heb gewoon 2 random plaatjes genomen

Ik hoop dat hij zo geod is,

Gr stefan

 

[Stormbringer]

re:

Hartelijk dank Stefan, hij werkt!

Groet, Stormbringer