SORU
29 Aralık 2011, PERŞEMBE


Nasıl iframe gizleme YouTube bir oyuncu Duraklat?

<iframe> bir gizli bir div YouTube video içeren var. Kullanıcı bir linke tıkladığında, bu div görünür hale gelir, kullanıcı videoyu oynatmak gerekir.

Kullanıcı panelini kapatır, video oynatma durması gerekir. Bunu nasıl başarabilir?

Kod:

<!-- link to open popupVid -->
<p><a href="javascript:;" onClick="document.getElementById('popupVid').style.display='';">Click here</a> to see my presenting showreel, to give you an idea of my style - usually described as authoritative, affable and and engaging.</p>

<!-- popup and contents -->
<div id="popupVid" style="position:absolute;left:0px;top:87px;width:500px;background-color:#D05F27;height:auto;display:none;z-index:200;">

  <iframe width="500" height="315" src="http://www.youtube.com/embed/T39hYJAwR40" frameborder="0" allowfullscreen></iframe>

  <br /><br /> 
  <a href="javascript:;" onClick="document.getElementById('popupVid').style.display='none';">
  close
  </a>
</div><!--end of popupVid -->

CEVAP
29 Aralık 2011, PERŞEMBE


Bu davranışı uygulamak için en kolay yolu pauseVideo playVideo yöntemleri, gerektiğinde çağırarak. ** 9, ben sonucu esinlenerek pluginless bir işlevi istenen davranışı elde etmek için yazdım.

Sadece ayarları:

  • Fonksiyon toggleVideo ekledik
  • Özelliğini etkinleştirmek için YouTube URL, ?enablejsapi=1 ekledik

Demo: http://jsfiddle.net/ZcMkt/< / ^ br . Kod:

<script>
function toggleVideo(state) {
    // if state == 'hide', hide. Else: show video
    var div = document.getElementById("popupVid");
    var iframe = div.getElementsByTagName("iframe")[0].contentWindow;
    div.style.display = state == 'hide' ? 'none' : '';
    func = state == 'hide' ? 'pauseVideo' : 'playVideo';
    iframe.postMessage('{"event":"command","func":"'   func   '","args":""}', '*');
}
</script>

<p><a href="javascript:;" onClick="toggleVideo();">Click here</a> to see my presenting showreel, to give you an idea of my style - usually described as authoritative, affable and and engaging.</p>

<!-- popup and contents -->
<div id="popupVid" style="position:absolute;left:0px;top:87px;width:500px;background-color:#D05F27;height:auto;display:none;z-index:200;">
   <iframe width="500" height="315" src="http://www.youtube.com/embed/T39hYJAwR40?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
   <br /><br />
   <a href="javascript:;" onClick="toggleVideo('hide');">close</a>

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • BigBoyTV

    BigBoyTV

    25 EYLÜL 2013
  • super1988guy

    super1988guy

    9 Aralık 2007
  • TantalizingTrance

    TantalizingT

    15 ŞUBAT 2009