Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    Aug 2010
    Posts
    405
    Thanks
    17
    Thanked 2 Times in 2 Posts

    toggle glitch on ipad?

    Here's a weird one... I have a toggle for a music file that plays when the site loads. There's a stop/play button on the page as well.

    On every browser, things work just fine. The music plays, the text says turn off/turn on just as it should.

    Except Ipad.
    When the page loads on an ipad, the song isn't playing. Yet, when I click the music off button, it turns the music on, and the text still says "turn off" - as it should when the page loads, and everything works as it should from there on. Weird. No settings have been changed on the ipad itself, so I'm stumped.

    There's nothing in the css affecting these sections, so it's not a stylesheet issue.

    Here's the javascript:
    Code:
    $(document).ready(function() {
    
    	$('#music_control,#music_control2').click(function(){
    	    if (!$("#song")[0].paused)
                        {
                            $("#song")[0].pause();           
                            $("#music_control").text("MUSIC ON");
                            $("#music_control2").text("MUSIC ON");
                        } else {
                            $("#song")[0].play();           
                            $("#music_control").text("MUSIC OFF");
                            $("#music_control2").text("MUSIC OFF");
                        }
           });     
    });
    and here's the html content:

    Code:
    <div id="music">
    	<audio id="song" autoplay loop> 
    		<source src="music/12_full_prom_night_0132.ogg" type="audio/ogg" />
    		<source src="	music/12_full_prom-night_0132.mp3" type="audio/mpeg" />
    		Your browser does not support the audio element.
    		</audio>
    </div>
    
    
    <a href="#" id="music_control2" class="">MUSIC OFF</a>

  • #2
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts

  • #3
    Regular Coder
    Join Date
    Aug 2010
    Posts
    405
    Thanks
    17
    Thanked 2 Times in 2 Posts
    ohhhh believe me. I haaaate autoplayed music. Tell my boss that. He insists. Everyone has told him it's not good. But he insists.

  • #4
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    get a fake newspaper made with a story about some place that lsot alot of business because they had autplay music on their site so they didnt get any return visitors, and leave it in his office or the bathroom or something. Im blessed with a boss that will listen to reason. I could show him anyone of those articles, and he'd go, oh well ****, lets not do that, but think of something else!

  • #5
    Regular Coder
    Join Date
    Aug 2010
    Posts
    405
    Thanks
    17
    Thanked 2 Times in 2 Posts
    also, for any future people who are forced by their bosses to try and solve this autoplay problem, I discovered that mobile tablet devices essentially turn off that ability. Doesn't work on chrome browsers on android, either.

    Maybe, if we're lucky, they'll do the same for desktop browsers!

    Makes it easier to tell the boss "no".

  • #6
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,190
    Thanks
    10
    Thanked 569 Times in 550 Posts
    you need a physical touch to init audio/video tags on IOS.

    you can put a giant header that must be scrolled past up top, and put a clear div over the page that plays the audio and removes itself upon touching.
    this will goad people into touching the screen and hence play the music.

    that said, if you did this to me me, i'd click back and never return.
    Last edited by rnd me; 04-04-2013 at 07:29 PM.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/1/19) IE7:0.2, IE8:6.7, IE11:7.4, IE9:3.8, IE10:4.4, FF:18.3, CH:43.6, SF:7.8, MOBILE:27.5


  •  

    Posting Permissions

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