Как задать эффект ховер и звуковой для ссылок?

Question

[mUchenik]

Друзья, всем привет!
Скажите, как сделать, что бы при наведении на ссылку ( в определенном блоке), воспроизводился звук, например щелчек и ссылка меняла цвет.
У меня сейчас сделано так:

<div class="gruppa">
<h2>Список ссылок 1</h2>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>

<h2>Список ссылок 2</h2>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>

</ul>
</div>


<div class="gruppa1">
<h2>Список ссылок 3</h2>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>

</div>

Answer 1

[Олег]

Как то так https://jsfiddle.net/wmawk2yf/

Comments

[mUchenik]

Спасибо!

[mUchenik]

Олег, я что то не могу понять... По ссылке, которую вы мне дали, всё работает, но когда я ввожу функцию в function.php то сайт перестаёт грузиться...

[Олег]

mUchenik: Я как то не телепат, что и куда вводите)

[mUchenik]

Олег: Сорри :(
И так:

<div class="">

<ul>
	<li><a id="myLink" href="#" onMouseOver="myaPlay()"></li>
	<li><a id="myLink" href="#" onMouseOver="myaPlay()"></li>
	<li><<a id="myLink" href="#" onMouseOver="myaPlay()"></a></li>
</ul>

</div>

Этот код вставляю в виджет.

Этот код вставляю в function.php в самый конец:

function myaPlay(){
var myAudio = new Audio;
myAudio.src = "http://space-base.ru/files/warning.wav";
myAudio.play();
}

И как только я вставляю в function.php сразу же вижу белый экран...

[Олег]

<div class="">

<ul>
  <li><a id="myLink" href="#" onMouseOver="myaPlay()">Ссылка 1</a></li>
  <li><a id="myLink" href="#" onMouseOver="myaPlay()">Ссылка 2</a></li>
  <li><<a id="myLink" href="#" onMouseOver="myaPlay()">Ссылка 3</a></li>
</ul>

</div>
<script>
      function myaPlay(){
      var myAudio = new Audio;
      myAudio.src = "http://space-base.ru/files/warning.wav";
      myAudio.play();
}
</script>

[Олег]

mUchenik: Это js скрипт а не пыха)

[mUchenik]

Олег: Спасибо!!! Всё работает!!!

[mUchenik]

mUchenik: Скажите, я правильно понимаю, что если я захочу свою мелодию поставить, то я могу создать папку audio на хостинге у себя, и в скрипте прописать

<script>
      function myaPlay(){
      var myAudio = new Audio;
      myAudio.src = "/audio/моя_мелодия.wav";
      myAudio.play();
}
</script>

[Олег]

mUchenik: Естественно)) и кстати почитайте о форматах для различных браузеров ;)

[mUchenik]

Спасибо.