How to change table background image upon mouseover of another link

I have this for changing the background image of div.fullscreen:

<div id="swatches">
  <a href="http://www-03.ibm.com/ibm/history/exhibits/storage/images/PH3380A.jpg">
    <img src="http://www.wmagency.co.uk/wp-content/uploads/2011/04/test.jpg"
         onmouseover="document.images['bigPic'].src='http://josefsipek.net/docs/s390-    linux/hercules-s390/ssh-dasd1.png';"
         width="72" he开发者_运维知识库ight="54" alt="Item ksc1" />
  </a>
</div>

However, is there a way to change the background image of a table on hover of another image link?

Sure, look at an example here.

This is done by giving the img an id and the table an id. Then we listen for when the mouse is over the img and when it does, change the background-image of the table.

Only want to use inline JavaScript? Use this:

<div id="swatches">
  <a href="http://www-03.ibm.com/ibm/history/exhibits/storage/images/PH3380A.jpg">
    <img src="http://www.wmagency.co.uk/wp-content/uploads/2011/04/test.jpg"
         onmouseover='document.getElementById("table_id_here").style["background-image"]="url(\'http://www.gravatar.com/avatar/\');'
         width="72" height="54" alt="Item ksc1" />
  </a>
</div>