How To Detect Browser Type In Html5 Or Javascript For Playing Mp3 Instead Of Webm In Safari/ie Browsers?

I have created a survey in Qualtrics wherein I play webm audios. However in Safari webm doesn't play and for IE the user needs to install this Google plugin. I was wondering if the

Solution 1:

If you provide both an mp3 and webm sources and you set the type attribute properly, the browser can select the one it supports. So just add the mp3 one. I would put the mp3 one first since some old Safari browsers only use the first one (and they supported mp3), but otherwise the browsers will select the first one they can support based on the type.

<audio controls=""id="audio3" style="display:none">
    <source src="http://langcomplab.net/Most_Precious_Possession_Master.mp3"
       style="width:50%"type="audio/mp3" />
    <source src="http://langcomplab.net/Most_Precious_Possession_Master.webm"
       style="width:50%"type="audio/webm" />
    Your browser doesn&#39;t support this audio format.
</audio>

See additional information on MDN which applies to both audio and video.

https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_HTML5_audio_and_video