Here is a simple audio player that has play and pause buttons. It can stream both streaming audio and static remote audio files.
It uses JavaScript and HTML. The play/pause buttons are Font Awesome fonts and can be styled with CSS.
This works on every device that I’ve tested it on. I’ve used this in both Android and iOS apps.
AUDIO PLAYER:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css'> <a id="play-pause-button" class="fa fa-play"></a> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js'></script> <script> var audio = new Audio("http://amber.streamguys.com:4510"); $('#play-pause-button').on("click",function(){ if($(this).hasClass('fa-play')) { $(this).removeClass('fa-play'); $(this).addClass('fa-pause'); audio.play(); } else { $(this).removeClass('fa-pause'); $(this).addClass('fa-play'); audio.pause(); } }); audio.onended = function() { $("#play-pause-button").removeClass('fa-pause'); $("#play-pause-button").addClass('fa-play'); }; </script> <style> #play-pause-button{<br /> font-size: 50px;<br /> cursor: pointer;<br />}<br /></style> |
About Author
