2016-08-04 45 views
0

我在网站上有很多视频,我在悬停iframe播放的悬停。并在mouseleave上它应该停止播放。Jquery Youtube Iframe Mouseenter and Mouseleave on hover

悬停和播放作品。但Mouseleave不工作,我不知道为什么。

$(document).ready(function() { 
 
\t \t $(".youtube").each(function() { 
 
\t \t  $(this).css('background-image', 'url(//i.ytimg.com/vi/' + this.id + '/hqdefault.jpg)'); 
 
\t \t  $(document).delegate('#' + this.id, 'mouseenter', function() { 
 
\t \t \t \t if($(this).data('mouseenter')) { 
 
\t \t \t \t \t return; 
 
\t \t \t \t } 
 
\t \t \t \t $(this).data('mouseenter', true); 
 

 
\t \t  var iframe_url = "//www.youtube.com/embed/" + this.id + "?autoplay=1&autohide=1"; 
 
\t \t  if ($(this).data('params')) iframe_url += '&' + $(this).data('params'); 
 
\t \t  var iframe = $('<iframe/>', {'allowfullscreen':'allowfullscreen', 'frameborder': '0', 'src': iframe_url}) 
 
\t \t  $(this).append(iframe); 
 
\t \t  }); 
 
\t \t \t var playersrc=$('.youtube').attr('src'); 
 
\t \t }); 
 
\t \t });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

+0

需要HTML,因为这涉及鼠标事件。一个可行的例子会很好,因为你有mouseenter部分工作。 – zer00ne

回答

0
$(document).delegate('#' + this.id, 'mouseleave', function() { 
      if($(this).data('mouseleave')) { 
       alert("not first time, but mouseleave is still detected"); 
       return; 
      } 
      alert("first time your cursor is quitting this iframe, mouseleave detected"); 
      $(this).data('mouseleave', true); 
     }); 

这对我的作品!