Изменить источник изображения, наведя на ярлык

Question

У меня есть несколько меток на панели моей веб-страницы, и я хочу, чтобы при наведении курсора на эту метку изображение в другом элементе div изменялось в зависимости от надвигаемой метки.

Любая помощь будет высоко оценена.

• Sjain

Answer 1

С jQuery , популярной библиотекой javascript, вы можете сделать это довольно легко:

- Пример HTML

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

- Соответствующий 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");
  }
);