jQuery detach div、divを追加

Question

Chrome/Safariでは、ライトボックスが閉じられると、Vimeoビデオはバックグラウンドで引き続き再生されます。この時点で「デタッチ」はビデオを停止するように機能しますが、ライトボックスを閉じてメニュー項目をクリックするとビデオを再び開くと、ビデオdivは空白になります。

ウェブサイト機能： 「a」「b」「c」をクリックすると、動画とともにライトボックスが表示されます。 ライトボックスの "X"をクリックすると、ライトボックスの内容が閉じます。

HTML/CSS 
    a id="alphaa" <------ The a, b, c menu item, when clicked, open the lightbox 
    .abcbox_content <------- The div that holds all the content for the lightbox 
    #videowrapper <------ div that holds the Vimeo iframe 
    .abc-align-right <---- the "X" to close the lightbox 

ここまではjQueryです。あなたは要素をクローニングが、クローンを使用していないように見えます任意の助け

Answer 1

ため

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $(".abc-align-right").click(function() { 
    $("#videowrapper").clone(true); 
    $("#videowrapper").contents().detach(); 
    if ($(".abcbox_content").is(':visible')) 
    $("#videowrapper").append(); 
    }); }); 
    </script> 

感謝。これを試してみてください：

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $(".abc-align-right").click(function() { 

     $("#videowrapper").replaceWith($("#videowrapper").clone(true)); 

    }); 
    </script> 

Answer 2

あなたはまた、ビデオを一時停止し、一時停止を解除するためにVimeoのJavascriptのAPIを使用することができます。

参照：http://vimeo.com/api/docs/player-js

あなたはIFRAMEにIDを割り当てる必要があり、その後のようなものだろう：

$(".abc-align-right").click(function() { 
    $("#iframe_id").postMessage({ "method": "pause" }); 
}); 

そして、あなたをライトボックスを呼び出し表示させるたび：

$("#iframe_id").postMessage({ "method": "play" }); 

を

同じページで3つの動画を扱うには、これを必要とするため、iframeまたは別のIDのクラスを使用することもできます。