CODEWITHSUNDEEP
javascripthtmlaudioslidervolume
Beginner
Beginner

Reputation: 117

Javascript play audio when loaded

so I have a code for volume slider. What it does is that it plays sound when you have changed volume after loading the slider. For example if default value of the slider is 50 it wont play sound right after loading the audio file, you need to change value to higher or lower so sound can come out. So I need help with JavaScript. What can I do so it starts playing the sound whenever is loaded?

Full code : https://www.w3schools.com/code/tryit.asp?filename=FQZVZUX36JFD

JS: 

$("#volume").slider({
min: 0,
max: 100,
value: 50,
    range: "min",
slide: function(event, ui) {
    setVolume(ui.value / 100);
}
});

var myMedia = document.createElement('audio');
$('#player').append(myMedia);
myMedia.id = "myMedia";

playAudio('http://listen.shoutcast.com/newfm64aac-', 0);

function playAudio(fileName, myVolume) {
        myMedia.src = fileName;
        myMedia.setAttribute('loop', 'loop');
    setVolume(myVolume);
    myMedia.play();
}

function setVolume(myVolume) {
var myMedia = document.getElementById('myMedia');
myMedia.volume = myVolume;
}

Upvotes: 1

Views: 342

Answers (2)

Ryne
Ryne

Reputation: 398

Google recently released a browser update that prevents initial playing or autoplaying of media elements (Note: not the solution for this answer, but a potential solution for similar cases.)

Upvotes: 2

Dan Raps
Dan Raps

Reputation: 318

You're setting the initial volume to zero with this call: 

playAudio('http://listen.shoutcast.com/newfm64aac-', 0);

To have it load at a default of 50 your call should be:

playAudio('http://listen.shoutcast.com/newfm64aac-', 50);

Upvotes: 1

Related Questions