Change image source by hovering on a label

I have multiple labels on a bar my web page and I want when I hover on that label, image in other div should change ba开发者_运维百科sed on the label being hovered.

Any help would be highly appreciared.

• Sjain

With jQuery, the popular javascript library, you could do it rather easily:

-- Sample HTML

<label class="target">Hover to Change</label> 
<img src="image001.gif" class="sourceImage" />

-- Corresponding jQuery

$("label.target").hover(
  function () {
    // mousing-over <label class="target"> changes img to 'image002.gif'
    $("img.sourceImage").attr("src", "image002.gif");
  },
  function () {
    // mousing-out <label class="target"> changes img to 'image001.gif'
    $("img.sourceImage").attr("src", "image001.gif");
  }
);