javascript - 关闭叠加层后,Youtube视频仍在播放

标签 javascript jquery html youtube overlay

我有一个嵌入的youtube视频的叠加层,该页面在加载页面时会打开,考虑到这是我第一次进行此类操作,因此所有效果都很好。但是,无论何时在播放视频时关闭覆盖层,都能听到在后台播放视频的声音,我不知道该如何解决。
我完全不知所措,由于我在编码方面的经验不足,我不知道该如何处理通过Google找到的解决方案。如果有人可以帮助我,我将不胜感激!

以下是叠加层的代码,请随时评论我可以对其进行的任何改进以及对问题的可能解决方案。

<html>
<head>
  <title>Test Overlay</title>
  <script src="http://cdn.jquerytools.org/1.2.6/full/jquery.tools.min.js"></script>  
   <style>
    #box {
    display:none;
    width:880px;
    border:10px solid #666;
    border:10px solid rgba(82, 82, 82, 0.698);
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
  }
  #box div {
    padding:10px;
    border:1px solid #3B5998;
    background-color:#fff;
    font-family:"lucida grande",tahoma,verdana,arial,sans-serif
  }
  #box h2 {
    margin:-11px;
    margin-bottom:0px;
    color:#fff;
    background-color:#6D84B4;
    padding:5px 10px;
    border:1px solid #3B5998;
    font-size:20px;
  }
  </style>
$(‘#videofeed’).appendTo(‘body’);
<!--[if IE]>
<style type="text/css">
  .box {
  background:transparent;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#333333,endColorstr=#333333    );
  zoom: 1;
  }
</style>
<![endif]-->
</head>
<body>
<!-- dialog -->
<div id="box">
  <div>
    <h2>Welcome!</h2>
    <table width="620" border="0" cellpadding ="0" cellspacing = "0" style="margin-left:auto; margin-right:auto;">
  <tr>    
  </tr>
  <tr>
    <td height="480"><iframe width="854" height="480" src="http://www.youtube.com/embed/ej08Oju4tu8" frameborder="0" allowfullscreen></iframe></td>
  </tr>
  </table>      
  </div>
</div>
<script>
$(document).ready(function() {
  $("#open_now").click(function() {
      $("#box").overlay().load();
  });
  $("#box").overlay({
    top: 260,   
    mask: {
    color: '#fff',
    loadSpeed: 200,
    opacity: 0.5
    },
    closeOnClick: true,
    load: true
    });
    });
</script>
</body>
</html>

最佳答案

尝试

$('#box').remove();

关闭覆盖层后

或者只是$('#box iframe').remove();

关于javascript - 关闭叠加层后,Youtube视频仍在播放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16817257/

相关文章:

javascript - 如何修改类方法?

javascript - 将监听器添加到动态添加的元素

javascript - JQuery,仅当目标 div 尚未具有带 id 的 div 时才克隆和追加

javascript - 在 forEach 中连续进行 AJAX 调用 - 为什么我看不到结果?

javascript - 从 src 属性开始获取父级

html - SVG <clipPath> 适合容器并使用 % 单位

javascript - Jquery 在表行中的两个类之间切换

javascript - 获取 "for of"循环内字符串中字符的位置

javascript - 如何在页面底部建立简单的粘性导航?

javascript - 触发 ng-model.$formatters 以编程方式运行