Support » Plugin: WP YouTube Lyte » Audio embed is a black bar on iPhone

  • Resolved stevygee1987

    (@stevygee1987)


    Hi,
    I’m currently working on a site that is also meant to be viewed on mobile devices. The client wants YouTube embeds for audio only, which is why I’m using your plugin.

    On an iPhone the audio embed is just a black bar, with no play button visible. When tapping on it, the video opens and starts playing properly. But it would be great if the user could see the play button! It works fine on my desktop.

    http://wordpress.org/plugins/wp-youtube-lyte/

Viewing 8 replies - 1 through 8 (of 8 total)
  • Video embeds look fine on the iPhone btw.

    Plugin Author Frank Goossens

    (@futtta)

    hmmm, iphone + audio, that’s a combination of edge cases 😉

    I have an idea of what might be causing this, I’ll experiment some the next couple of days and let you know if & how we can solve this.

    Plugin Author Frank Goossens

    (@futtta)

    Well, turns out there’s no bug in my code after all; the problem is that YouTube does not show the bottom controls at all on mobile (both iOS and Android). This is not a huge deal for normal video’s, but does break the (frowned upon, as in not really allowed by the YT TOS) audio-only embeds.

    I’ve created a ticket at YT’s official support-group on stack overflow to see if/ how I can force the controls to be visible anyhow.

    Let’s see where that leads us. Thanks for reporting anyhow, I wouldn’t have easily spotted this issue myself.

    Hi, thanks for looking into it!

    Is there I way that I could force an audio embed to open as full video under certain conditions? Like when a mobile platform is detected?

    Plugin Author Frank Goossens

    (@futtta)

    sure; in lyte(-min).js you’d have to replace

    if (tH.className.indexOf("audio") !== -1) { qsa+="&autohide=0";aHgh="438";aSt="position:relative;top:-400px;" } else { aHgh=tH.clientHeight;aSt=""; }

    on line 65 by

    if ((tH.className.indexOf("audio") !== -1) && (aP == 1)) {
            qsa+="&autohide=0";aHgh="438";aSt="position:relative;top:-400px;"
        } else if ((tH.className.indexOf("audio") !== -1) && (aP == 0)) {
            tH.parentNode.style.height="";
            tH.style.height="";
            aHgh=tH.clientHeight;
            aSt="height:"+aHgh+"px !important;";
        } else {
            aHgh=tH.clientHeight;aSt="";
        }

    a bit of a hack, but that’s what you get with combinations of edge-cases 😉

    works perfectly, thanks!

    Plugin Author Frank Goossens

    (@futtta)

    thanks for the confirmation, I’ll probably release 1.3.1 with this specific workaround somewhere tomorrow.

    Plugin Author Frank Goossens

    (@futtta)

    so that’s 1.3.1 for & thanks to you, stevygee1987 😉

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Audio embed is a black bar on iPhone’ is closed to new replies.