CODEWITHSUNDEEP
htmlaudio
aquagremlin
aquagremlin

Reputation: 3549

controlling audio programmatically on a web page

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 ?

Upvotes: 1

Views: 8570

Answers (1)

ScaisEdge
ScaisEdge

Reputation: 133360

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

Upvotes: 2

Related Questions