1

I know that HTML5 allows audio embedding and control like so:

<audio controls
  src="http://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.mp3">
Your user agent does not support the HTML5 Audio element.
</audio>

but how can i set the volume initially? And for extra credit-how can i change the tune as the user scrolls past a certain or ?

aquagremlin
  • 3,515
  • 2
  • 29
  • 51

1 Answers1

2

You can do easly with the properties via css or with javascript.

Assign at you <audio> and id and the set the porperties in proper css eg:

<audio controls  id="my_audio" volume="0.8" 
   src="http://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.mp3">
  Your user agent does not support the HTML5 Audio element.
</audio>

css

#my_audio{
   volume: 0.9;     
   height: 10 px;   
   width: 50px;
  }

or javascript

<script>

    var theAudio = document.getElementById('my_audio');
    theAudio.style.volume = 0.8;

</script>

see MDN ref1 and ref2 for more

ScaisEdge
  • 131,976
  • 10
  • 91
  • 107
  • thank you. I guess a way to answer my second question is here: http://stackoverflow.com/questions/5036850/how-to-detect-page-scroll-to-a-certain-point-in-jquery but that example just fires an alert. An it seems to have a bug, firing the alert multiple times. – aquagremlin Aug 03 '15 at 02:32
  • I tried to follow Reigel's recommendation but it didn't work. Here's my example http://jsfiddle.net/okstef/r0nq40ek/ – aquagremlin Aug 03 '15 at 03:19
  • Please explain better. You need to know how manage an'audio element event? – ScaisEdge Aug 03 '15 at 06:20