CODEWITHSUNDEEP
javascripthtmlgithubaudioautoplay
spiedy
spiedy

Reputation: 1

why unable to implement audio property in simple (HTML , CSS , JS ) website online

Actually, my problem is ,its not auto playing the audio in song (chinese.mp3)file. I gave it on github.

no error (console)

no glitch in website .

but, just audio is missing.

can you help me out?

----link of my Memory Mania game project:-

github

---its online (netlify) hosted link :- Link

I have tried :

<div class="music">
        <audio autoplay>
          <source src="./songs/chinese.mp3" type="audio/mp3" id="myaudio" />
          Your browser does not support the audio element.
        </audio>
</div>

even in some past commits applied this:


<audio autoplay id="myaudio">
          <source src="./songs/chinese.mp3" type="audio/mp3" allow="autoplay"/>
          Your browser does not support the audio element.
        </audio>

js used:


// ---------------    auto - play    --------------------
var x = document.getElementById("myaudio").autoplay;

Upvotes: -1

Views: 44

Answers (2)

chris-calmatlas
chris-calmatlas

Reputation: 1

The answer is the browser waits to autoplay by default. Yogi's comment has a very relevant link.

Additionally I found https://stackoverflow.com/a/66606484/21496013 which tries to play the audio every 5 seconds. This is one possible solution.

// --------------- volume controls ----------------
//var audio = document.getElementById("myaudio");
//audio.volume = 0.5;
// ---------------    auto - play    --------------------
//var x = document.getElementById("myaudio").autoplay;

const tryToPlay = setInterval(() => {
  const audio = document.querySelector(".audioElement")

  audio.play()
      .then(() => {
          clearInterval(tryToPlay);
      })
      .catch(error => {
          console.info('User has not interacted with document yet.');
      });
}, 5000);
      <div class="music">
        <audio autoplay class="audioElement">
          <source src="./songs/chinese.mp3" type="audio/mp3" id="myaudio"/>
          Your browser does not support the audio element.
        </audio>
      </div>

Upvotes: -1

javier ferrer
javier ferrer

Reputation: 1

browsers do not run the audio directly, it is like a protection system, you have to activate the audio, in some browsers like Firefox you will see the icon in the search bar, enable the audio and enjoy!

Upvotes: -1

Related Questions