login  Naam:   Wachtwoord: 
Registreer je!
 Forum

javascript onmouseover

Offline japiepatat - 16/02/2009 18:05
Avatar van japiepatatNieuw lid ik gebruik onmouseover en onmouseout met javascript om een plaatje te laten wisselen. maar hij doet heel raar. kijk eens op www.simitch.nl. het gaat om het plaatje linksboven(de douchekop). wie kan mij helpen? laat het me dan weten

Henriet

3 antwoorden

Gesponsorde links
Offline anton - 16/02/2009 18:09
Avatar van anton Lid code graag???

Bij mij wisselt het plaatje , maar als ik eruit ga met m'n muis blijft hij staan...
Alleszins zou het helpen als we je code zien.

MVG
Anton Vandeghinste
Offline Martijn - 16/02/2009 18:40
Avatar van Martijn Crew PHP wat je denk beter kunt doen, is dat plaatje als background instellen van die div, en met een mouseOver en Out de background laten veranderen.

Verder, het zit ergens in je mouseOut, want als ik die uit je code haal, werkt het niet zo raar.
Offline japiepatat - 16/02/2009 19:17 (laatste wijziging 16/02/2009 19:20)
Avatar van japiepatat Nieuw lid
html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>Mobiele badkamers</title>
  6.  
  7. <script type="text/javascript">
  8. function set(id,img)
  9. 	{document.getElementById(id).innerHTML = '<img src="'+img+'" />';
  10.   }
  12.  
  13.  
  14.  
  15. <style type="text/css">
  16.  
  17.  
  18. body{
  19. 	background-color:#1C1C1C;
  20. 	background-repeat:repeat-x;
  21.  
  22. }
  23.  
  24.  
  25.  
  26. .box {position: relative; width: 800px; height: 650px; margin: 5em auto; background-color:#999999;}
  27.  
  28. /* Positie divs */
  29. #lb, #rb, #lo, #ro {position: absolute; width: 20px; height: 20px; background: #1C1C1C; overflow: hidden;}
  30. #lb {top: 0px; left: 0px;}
  31. #rb {top: 0px; left: 780px;}
  32. #lo {top: 630px; left: 0px;}
  33. #ro {top: 630px; left: 780px;}
  34.  
  35. /* Bullet divs */
  36. #lb-bullet, #rb-bullet, #lo-bullet, #ro-bullet {position: absolute; font-size: 150px; font-family: arial; color:#999999; line-height: 40px;}
  37. #lb-bullet {left: -8px;}
  38. #rb-bullet {left:-25px;}
  39. #lo-bullet {top: -17px; left: -8px;}
  40. #ro-bullet {top: -17px; left: -25px;}
  41.  
  42. .boxa {position: absolute; width: 250px; height: 250px; left:125px; top:50px; background-color:#999999; cursor:pointer;}
  43.  
  44. .boxb {position: absolute; width: 250px; height: 250px; left:425px; top:50px; background-color:#999999;}
  45.  
  46. .boxc {position: absolute; width: 250px; height: 250px; left:425px; top:350px; background-color:#999999;cursor:pointer;}
  47.  
  48. .boxd {position: absolute; width: 250px; height: 250px; left:125px; top:355px; background-color:#999999;}
  49.  
  50. .boxe {position: absolute; width: 50px; height: 500px; left:15px; top:75px; background-image:url(SIMITCH.NL.png);}
  51.  
  52.  
  53. a:link {
  54. 	text-decoration: none;
  55. }
  56. a:visited {
  57. 	text-decoration: none;
  58. }
  59. a:hover {
  60. 	text-decoration: none;
  61.  
  62. }
  63. a:active {
  64. 	text-decoration: none;
  65. }
  67.  
  68. </head>
  70.  
  71. <div class="box">
  72.  <div id="lb"><div id="lb-bullet">&bull;</div></div>
  73.  <div id="rb"><div id="rb-bullet">&bull;</div></div>
  74.  <div id="lo"><div id="lo-bullet">&bull;</div></div>
  75.  <div id="ro"><div id="ro-bullet">&bull;</div></div>
  76.  
  77.  <div class="boxa" id="linksboven" onmouseover="set(this.id,'keukenkraan.png')" onmouseout="set(this.id,'douchekop2.png')">
  78.  <a href="home.html" title="Mobiele badkamers"><img src="douchekop2.png" style="border-style:none;"/></a></div>
  79.  
  80.  <div class="boxb"><img src="druppels blauw.png"/></div>
  81.  
  82.  <div class="boxc"><a href="home.html" title="Mobiele badkamers"><img src="keukenkraan.png" style="border-style:none;"/></a> </div>
  83.  
  84.  <div class="boxd"><img src="druppels blauw.png"/></div> 
  85.  
  86.   <div class="boxe"></div>
  87.  
  88. </div>
  89. </body>
  90. </html>


DeviourSoul schreef:
even wat lege regels verwijderd
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.171s