[SOLVED] Why wont this work?

[deadlyp99]

Why wont the following code work? I'm trying to get the image to change on a mouse over, and it simply is not changing

 

The div is returning the mouseover event, so I know that works. I tested with a simple alert. But why it wont change images... I dont know.

 

Thanks for any help.

 

<?php 
echo "
<div id=\"linkbox1\" style=\"position:relative;top:60px;background-image:url('./include/images/link.gif');height:20px;width:50px;\" onmouseover=\"document.getElementById('linkbox1').style.BackgroundImage='url(./include/images/link_over.gif)';\">words</div>
";
?>

[JasonLewis]

The syntax is this:

 

object.style.backgroundImage='url(hello.gif)'

 

You have:

 

object.style.BackgroundImage='url(hello.gif)'

 

Also, to shorten your code, instead of using getElementById(), since you are changing the current images background image all you need to do is use this.

 

<?php 
echo "
<div id=\"linkbox1\" style=\"position:relative;top:60px;background-image:url('./include/images/link.gif');height:20px;width:50px;\" onmouseover=\"this.style.backgroundImage='url(./include/images/link_over.gif)';\">words</div>
";
?>

[deadlyp99]

Thanks.

Thats the only thing I hate about javascript, case sensitive in a weird way.

 

Thanks for the "this" tip. I knew about it, but I couldn't remember the syntax for it, and didn't want to chance causing even more problems with the code.