如何使用jquery制作iframe的克隆?

时间:2015-08-22 20:29:50

标签: javascript jquery html css iframe

每个人我都有两个div id 我有一个in,我正在使用jquery获取其内容onscroll。

now i want onscroll pause the video in "myplayer" and it should play from same time in "getMyPlayer"  

提前致谢。

$(window).scroll(function (event) {
   var scroll = $(window).scrollTop();
   /* alert(scroll);*/
   if(scroll > 600)
   {
     $('#getMyPlayer').css('display','block');
   }
   else
   {
     $( '#myplayer' ).clone().appendTo( '#getMyPlayer' );
     $('#getMyPlayer').css('display','none'); 
   }
});
<div id="myplayer">
<iframe width="500" height="500" src="//www.ytapi.com/embed/<?php echo $yt->id ?>?autoplay=1" frameborder="0" allowfullscreen></iframe>
</div> 
<div id="getMyPlayer"></div>

1 个答案:

答案 0 :(得分:0)

您所要做的就是在.clone()。

之前将iframe添加到选择器

$(window).scroll(function (event) {
   var scroll = $(window).scrollTop();
   /* alert(scroll);*/
   if(scroll > 600)
   {
     $('#getMyPlayer').css('display','block');
   }
   else
   {
     $( '#myplayer iframe' ).clone().appendTo( '#getMyPlayer' ); // this line is different
     $('#getMyPlayer').css('display','none'); 
   }
});

请注意,因为每次更新滚动位置时都会运行此代码。我建议在克隆之前添加一个if语句来检查它是否已被复制。

$(window).scroll(function (event) {
   var scroll = $(window).scrollTop();
   /* alert(scroll);*/
   if(scroll > 600)
   {
     $('#getMyPlayer').css('display','block');
   }
   else
   {
     if ($( '#getMyPlayer iframe' ).length === 0) {
         $( '#myplayer iframe' ).clone().appendTo( '#getMyPlayer' ); 
         $('#getMyPlayer').css('display','none'); 
     }
   }
});