login  Naam:   Wachtwoord: 
Registreer je!
 Forum

onclick 2 keer

Offline monkey25 - 31/03/2008 22:29
Avatar van monkey25Nieuw lid hoe kan ik eigenlijk het effect creeren met JavaScript dat als ik op een plaatje klikt dat hij dan een ander plaatje krijgt en als je weer klikt nog een plaatje en als hij dan bij het einde van alle plaatjes is met klikken dat je dan weer bij het eerste plaatje komt en alles van voor af aan doet?

bij voorbaat dank, Monkey25

4 antwoorden

Gesponsorde links
Offline Stijn - 31/03/2008 22:36
Avatar van Stijn PHP expert Je moet dus in javascript een array maken van de afbeeldingen. Je houdt een positie teller bij die start bij 0. Op je <img> zet je een onclick event die een functie aanroept die de src van de <img> verandert met de afbeelding in de array.

javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. var afbeeldingen = new Array();
  2. afbeeldingen[0] = "/path/to/image.jpg";
  3. afbeeldingen[1] = "/path/to/other/image.jpg";
  4. ...
  5.  
  6. int positie = 0;
  7.  
  8. function veranderAfbeelding( obj )
  9. {
  10.  
  11.     if( positie == afbeeldingen.length ) positie = 0;
  12.  
  13.     obj.src = afbeeldingen[ positie++ ];
  14.  
  15. }


En dan kan je de functie als volgt oproepen:

html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <img src="...." onclick="veranderAfbeelding(this);" />
Offline Bruud - 31/03/2008 22:37
Avatar van Bruud Nieuw lid je kan een functie maken die elke keer 1 erbij opteld, en als hij bijvoordbeeld 10 is dat hij weer overnieuw begint.
Offline monkey25 - 31/03/2008 22:49
Avatar van monkey25 Nieuw lid ik dacht dat ik het goed heb gedaan maar toch doet hij het niet, wat is hier eigenlijk fout aan:
of moet de eerste afbeelding in de array dezelfde zijn als degene in de html?

in de head;
html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <script type="text/javascript" src="scripts/img.js"></script>


in de body;
html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <img src="plaats plaatje" onclick="veranderAfbeelding(this);" alt="*" />


en de javascript (img.js)
javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. var afbeeldingen = new Array();
  2. afbeeldingen[0] = "een ander plaatje";
  3. afbeeldingen[1] = "en nog een";
  4. afbeeldingen[2] = "en nog eentje dan maar";
  5.  
  6. int positie = 0;
  7.  
  8. function veranderAfbeelding( obj )
  9. {
  10.  
  11.     if( positie == afbeeldingen.length ) positie = 0;
  12.  
  13.     obj.src = afbeeldingen[ positie++ ];
  14.  
  15. }


ps: dankjewel voor de snelle reacties
Offline Stijn - 31/03/2008 23:14
Avatar van Stijn PHP expert int positie bestaat niet. Het moet var positie zijn. Ik zou het laatste element van de array de afbeelding zetten van de <img> tag.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.199s