www.webdeveloper.com
Results 1 to 4 of 4

Thread: HTML5 - Audio does not play on mobile

  1. #1
    Join Date
    Jan 2018
    Posts
    19

    HTML5 - Audio does not play on mobile

    Hi,

    I have challanges running this code below on mobile (iPhone and Android)

    Purpose of the code:
    Play a webradio automatically, once the page is loaded. No extra click is required on "play" button.

    Issue:
    On mobile (iPhone and Android) I need to press the "play" button, otherwise it does not play the web-radio.
    On windows computer, I don't have this issue.

    What do I need to do, so that an extra click on "play" button is not required on mobile?

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <script>
    	function runRadio() {
    		var audio = document.getElementById("myaudio");  
    		
    		audio.volume = 1;	
    		audio.src = "https://br-br1-obb.sslcast.addradio.de/br/br1/obb/mp3/128/stream.mp3";  	
    		audio.preload = "none";		
    		audio.play();		
    	}
    </script>
    
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    
    <body onload="runRadio()">
    	<audio id="myaudio" controls="true"  autoplay="true" >
    		<source src="#" type="audio/mpeg" />
    		This text displays if the audio tag isn't supported.
    	</audio>		
    </body>
    </html>

  2. #2
    Join Date
    Dec 2012
    Posts
    1,608
    This is a common issue and is discussed, e. g., here:
    https://www.aerserv.com/why-does-vid...ices-not-work/

  3. #3
    Join Date
    Jan 2018
    Posts
    19
    @Sempervivum
    Thanks! That make sense!

  4. #4
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    5,762
    You set the source in a <source tag but apply your setting to the <audio tag? Maybe moving the src attribute in to the <audio tag along with the type attribute, do away with the <source tags and see what happens.
    --> JavaScript Frameworks like JQuery, Angular, Node <--
    ... and please remember to wrap code with forum BBCode tags:-

    [CODE]...[/CODE] [HTML]...[/HTML] [PHP]...[/PHP]

    If you can't think outside the box, you will be trapped forever with no escape...

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center

"

"