I am trying to save the volume of a playing music file in a cookie so when the page is reloaded, the volume the user chose last is maintained, rather than turning up super loud or whatever.

Here's my test code for the eventlistener:

var myAudio = document.getElementById("audio1");

myAudio.addEventListener('change',alert("Audio Volume Changed"),true};

However, it does not respond when I change the volume. I've searched and despite it being something I think is pretty practical, there's no information on it.

I am trying to save the volume of a playing music file in a cookie so when the page is reloaded, the volume the user chose last is maintained, rather than turning up super loud or whatever.

Here's my test code for the eventlistener:

var myAudio = document.getElementById("audio1");

myAudio.addEventListener('change',alert("Audio Volume Changed"),true};

However, it does not respond when I change the volume. I've searched and despite it being something I think is pretty practical, there's no information on it.

• javascript

Share Improve this question Follow edited Jul 9, 2013 at 0:39 JVE999 asked Jul 8, 2013 at 23:45 JVE999JVE999 3,5271212 gold badges6161 silver badges9696 bronze badges 3

• 3 1. addEventListener, not addEventListner 2. Pass a function as the second argument; that code just calls alert(). – Matt Ball Commented Jul 8, 2013 at 23:46
• I can't believe I missed that typo. Anyway, I changed it to myAudio.addEventListener('change',function () {alert("Audio Volume Changed");},true}; and nothing happens when I change the volume. – JVE999 Commented Jul 9, 2013 at 0:07
• I went ahead an edited the original, since that doesn't seem to be the real problem. I'm guessing it doesn't send a value on the volume change? That doesn't make sense since the audio element has a volume attribute... so, I don't know. – JVE999 Commented Jul 9, 2013 at 0:40

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

You're looking for the "volumechange" event.

var audio = document.getElementById('sample');

audio.addEventListener('volumechange', function() {
    console.log('changed.', arguments);
}, false);

I'm using the bubble phase(as opposed to capture) in this example.

http://jsfiddle/426E6/

http://www.w3/html/wg/drafts/html/master/embedded-content-0.html#event-definitions