login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Vote probleem (Opgelost)

Offline zwobbel - 15/02/2007 15:02 (laatste wijziging 15/02/2007 15:13)
Avatar van zwobbelPHP gevorderde Ik heb een sterre vote gemaakt maar als je nu over een scrol gaat verandert alleen de ster van afbeelding. Maar als ik nu naar de 2de ster ga dan verandert alleen de 2de ster in een vollester... Nu zou ik willen dat als ge over de 2de gaat zowel de eerste mee vol kleur als de 2de.
Dit geld ook voor de derde maar dan de 1ste, 2de en 3de .
En zo verder dus in feite...

Wie kan me helpen?
Wat ik nu heb is dit dus:
http://www.anime2leech.com/media/vote/vote.html

3 antwoorden

Gesponsorde links
Offline Thomas - 15/02/2007 16:23
Avatar van Thomas Moderator Maak een functie met een aantal-parameter (0 t/m 5).
Geef de images een naam + nummer (1 t/m 5).
Maak bij elke image een onmouse-over die deze functie aanroept met het bijbehorende nummer.
Bij het uitvoeren van deze functie maak je alle sterren t/m dit nummer "aan", en alles na dit nummer tot 5 "uit".
En bij een onmouseout roep je deze functie aan met parameter-waarde 0 (alles uit).
Offline zwobbel - 15/02/2007 16:30
Avatar van zwobbel PHP gevorderde Hmmm geen ide hoe ik dat moet maken .. dit is gemaakt met photoshop 
Offline Thomas - 15/02/2007 16:47
Avatar van Thomas Moderator Je hebt maar 2 plaatjes nodig:
on.gif
off.gif

code:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE html
  2. 	PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  3. 	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html>
  5. <head>
  6. <title></title>
  7. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  8. <script type="text/javascript">
  9. // preload
  10. var star_on = new Image();
  11. star_on.src = "on.gif";
  12.  
  13. var star_off = new Image();
  14. star_off.src = "off.gif";
  15.  
  16. function show_stars(nr)
  17. {
  18. 	// wax on
  19. 	for(var i = 1; i <= nr; i++) document.images['star_'+i].src = star_on.src;
  20. 	// wax off
  21. 	for(var i = (nr+1); i <= 5; i++) document.images['star_'+i].src = star_off.src;
  22. }
  23. </script>
  24. </head>
  25.  
  26. <body>
  27. <img src="off.gif" name="star_1" onmouseover="show_stars(1)" onmouseout="show_stars(0)" alt="1/5" />
  28. <img src="off.gif" name="star_2" onmouseover="show_stars(2)" onmouseout="show_stars(0)" alt="2/5" />
  29. <img src="off.gif" name="star_3" onmouseover="show_stars(3)" onmouseout="show_stars(0)" alt="3/5" />
  30. <img src="off.gif" name="star_4" onmouseover="show_stars(4)" onmouseout="show_stars(0)" alt="4/5" />
  31. <img src="off.gif" name="star_5" onmouseover="show_stars(5)" onmouseout="show_stars(0)" alt="5/5" />
  32. </body>
  33. </html>


Het effect is mooier als je alle <img>-tags achter elkaar zet (zonder spaties). Voor de overzichtelijkheid staan ze in bovenstaande code op aparte regels.

Succes.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.265s