4 svar · 274 visningar · startad av eriks
Hej, jag är väldigt dålig på JavaScript men jag har lyckats kopiera ihop ett script som ska byta bilder när man håller muspekaren över. Jag har emellertid sett på andra sidor att de har text brevid bilder, vilken även den bytar till en annan text när man håller muspekaren över. Jag har ingen aning hur man ska göra detta, kan någon hjälpa mig?
Min kod ser ut så här:
i head-taggen
<script language="JavaScript">
<!--
if (document.images) {
image1on = new Image();
image1on.src = "Images/bertbra22.jpg";
image1off = new Image();
image1off.src = "Images/bertbra2.jpg";
}
function changeImages() {
if (document.images) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments*].src = eval(changeImages.arguments[i+1] + ".src");
}
}
}
// -->
</script>
i body-taggen
<table width=200 border=0 cellpadding=0 cellspacing=0>
<tr><td width=200><a href="bert.asp" onMouseOver="changeImages('image1', 'image1on')" onMouseOut="changeImages('image1', 'image1off')">
<img name="image1" src="Images/bertbra2.jpg" alt="bert" width=200 height=250 border=0></a>
</td>
</tr>
</table>
Hur ska jag skriva för att få även en text som ändrar sig?
Tack! MVH Erik*
Exempel:
<script type="text/javascript">
<!--
function changeImg(o, i, s){
o.src = i;
document.getElementById("cell").innerHTML = s;
};
//-->
</script>
...
<table width="400">
<tr>
<td><img src="foo.gif" height="250" width="200" onmouseover="changeImg(this,'bar.gif', 'mouseover')" onmouseout="changeImg(this,'foo.gif','')"></td>
<td width="200" id="cell">Texten hamnar här...</td>
</tr>
</table>
:)
Tack, fast det funkar inte riktigt som jag vill...
Det står att det har uppstått ett scriptfel när jag laddar sidan, och när jag håller musen över bilden så ändras den inte.
Jag vet inte om jag har uttryckt mig otydligt, men jag vill att även texten ska ändras när jag för musen över bilden. Typ om den inte är över ska det stå Erik, och när den är över ska det stå Erika. Hur ska koden ändras?
MVH Erik
Hmm... märkligt, funkar perfa hos mig.
Vill du ha det som du beskriver så behöver du inte ändra något.
Jag ser att du använder IE4.x. Klistra in denna kod och testa:
<head>
<script type="text/javascript">
<!--
function changeImg(o, i, s){
o.src = i;
document.all ? document.all["cell"].innerHTML = s : document.getElementById ? document.getElementById("cell").innerHTML = s : null;
};
//-->
</script>
</head>
...
<table width="400">
<tr>
<td><img src="foo.gif" height="250" width="200" onmouseover="changeImg(this,'bar.gif', 'Erika')" onmouseout="changeImg(this,'foo.gif','Erik')"></td>
<td width="200" id="cell">Erik</td>
</tr>
</table>
Kom ihåg att byta ut relevanta bildnamn.
:)