CODEWITHSUNDEEP
javascripthtmlaudio
GBF
GBF

Reputation: 29

Hover, click, and release sounds not working. I'm confused

I'm trying out new things for my website which involve when I hover, click or release a link I interact with it should play a sound. I am still getting used to the basics of HTML, sorry if I seem confused but I thought this would have been the right direction.

This is what I have so far:

<html>
  <audio id="myaudio" src="hover"></audio>
  <audio id="myaudio2" src="click"></audio>
  <audio id="myaudio3" src="release"></audio>
  <body>
    <a href="https://google.com"
       onmouseover="document.getElementById('myaudio').play()"
       onmousedown="document.getElementById('myaudio2').play()"
       onmouseup="document.getElementById('myaudio3').play()">google.com</a>
  </body>
</html>

Upvotes: 1

Views: 64

Answers (2)

Saw Saw
Saw Saw

Reputation: 11

In order to make your web page plays music, the html code can be as simple as

<audio id="myaudio" src="c.mp3" controls></audio>

Upvotes: 0

GBF
GBF

Reputation: 29

@guest271314 helped me with this one, turns out it was really easy. I forgot that the SRC tag needs to point to a link. Here is the correction:

<html>
<audio id="myaudio" src="http://yourdomain.com/hover.wav"></audio>
<audio id="myaudio2" src="http://yourdomain.com/click.wav"></audio>
<audio id="myaudio3" src="http://yourdomain.com/release.wav"></audio>
<body>
<a href="https://google.com" onmouseover="document.getElementById('myaudio').play()" onmousedown="document.getElementById('myaudio2').play()" onmouseup="document.getElementById('myaudio3').play()">google.com</a>
</body>
</html>

Here's the part fixed:

src="http://yourdomain.com/sound.wav"

Upvotes: 1

Related Questions