[js] getlementbyid :: veranderen img src

[me1299]

Ik de volgende code in een website verwerkt zitten om een rollover te realiseren:

code:

<img src='images/menu/home_deselected.gif' id='home'
onmouseover="document.getElementByID(home).src
 = 'images/menu/home_selected.gif';" onmouseout="document.getElementByID
(home).src = 'images/menu/home_deselected.gif';">

Volgens mij zou het zo moeten werken. Ik heb als referentie deze website gebruikt:

http://www.safalra.com/programming/javascript/collapse.html

Ik krijg als ik de website uitvoer on firefox in mijn javascript console de volgende error:

Error: document.getElementByID is not a function

Ik heb ook al met google op deze foutmelding gezocht maar daar kwam niet echt een oplossing uit.

[ Voor 21% gewijzigd door me1299 op 01-11-2004 13:54 ]

[crisp]

Het is getElementById en niet getElementByID, en zet home tussen quotes.
Nog beter: gebruik het this keyword:

HTML:

onmouseover="this.src='images/menu/home_selected.gif'"

[ Voor 49% gewijzigd door crisp op 01-11-2004 13:57 ]

[André]

Die error komt door dat ID Id moet zijn

En crisp zijn manier is makkelijker.

[me1299]

crisp schreef op 01 november 2004 @ 13:55:
zet home tussen quotes, of nog beter: gebruik het this keyword:

HTML:

onmouseover="this.src='images/menu/home_selected.gif"

het is trouwens getElementById en niet getElementByID

Dit:

code:

<img src='images/menu/home_deselected.gif' id='home' 
onmouseover="document.getElementById['home'].src 
= 'images/menu/home_selected.gif'" onmouseout="document.getElementById
['home'].src = 'images/menu/home_deselected.gif'">

resulteert in precies dezelfde foutmelding. Ook wil graag geen this gebruiken omdat ik strax ook een stukje code nodig heb waarbij een rollover een ander element wijzigd.

[ Voor 10% gewijzigd door me1299 op 01-11-2004 13:59 ]

[me1299]

André schreef op 01 november 2004 @ 13:56:
Die error komt door dat ID Id moet zijn

En crisp zijn manier is makkelijker.

Dat vond ik met google ook, maar dat helpt dus ook niet.

[Thijsmans]

gebruik dan ook eens ronde haakjes

[André]

code:

<img src='images/menu/home_deselected.gif' id='home' 
onmouseover="document.getElementById('home').src 
= 'images/menu/home_selected.gif'" onmouseout="document.getElementById
('home').src = 'images/menu/home_deselected.gif'">

Of gebruik dan een functie:

code:

function Doe(id, plaatje)
{
  document.getElementById(id).src = plaatje;
}

<img src='images/menu/home_deselected.gif' id='home' 
onmouseover="Doe('home', 'images/menu/home_selected.gif');" onmouseout="Doe('home', 'images/menu/home_deselected.gif');">

[me1299]

Prammenhanger schreef op 01 november 2004 @ 14:00:
gebruik dan ook eens ronde haakjes

Dat was dus de oplossing

Bedankt allemaal!!

Die haken gebruikte ik omdat ik een stukje code vond wat zo luide: document.forms['formname'].submit();

maar daar zal dan wel verschillen vanwege het feit dat de source een value is en een de formulier naam een naam is.

[ Voor 36% gewijzigd door me1299 op 01-11-2004 14:04 ]

[André]

DeathKnight schreef op 01 november 2004 @ 14:02:
[...]

maar daar zal dan wel verschillen vanwege het feit dat de source een value is en een de formulier naam een naam is.

Nee, forms[] is een array met alle formulieren en getElementById() is een functie die een referentie naar een element returned