网站 YouTube 嵌入视频不断播放

2024-05-20

我正在使用 youtube 提供的 iframe 在我的网站上嵌入视频。

我还使用了一个 css 弹出窗口,这是我从这个页面学到的http://www.pat-burt.com/web-development/how-to-do-a-css-popup-without-opening-a-new-window/ http://www.pat-burt.com/web-development/how-to-do-a-css-popup-without-opening-a-new-window/

所以我的 html 代码看起来像这样

<div id="blanket" style="display:none;"></div>
<div id="popUpDiv" style="display:none;">
<font size="4" color="#ffffff"><a style="color: #ffffff" href="javascript:void(null)" onclick="popup('popUpDiv')">Close</a><br></font>
<iframe width="560" height="315" src="http://www.youtube.com/embed/h3Pb6IyFvfg" frameborder="0" allowfullscreen></iframe>
</div>
<a href="javascript:void(null)" onclick="popup('popUpDiv')" class="more_details">more details</a>

一切都按我想要的方式工作,但是如果我将浏览器切换到 Internet Explorer 或 Chrome,当我选择关闭以关闭弹出窗口时,视频会继续播放吗?我做了一些谷歌搜索,发现其他人也有同样的问题,但是我只能找到无法按预期工作的代码。

基本上我想在弹出窗口关闭时停止视频,如何做到这一点。感谢您的任何帮助


我以前也遇到过同样的问题。
我所做的是删除iframe的src当我关闭弹出窗口时把它放回当我在 jQuery 中打开它时。这样,我确信当弹出窗口关闭时视频不会继续播放。

Edit添加了一个示例:

在包含视频 url 的函数中添加可选参数

<a href="javascript:void(null)" onclick="popup('popUpDiv', 'http://www.youtube.com/embed/NWHfY_lvKIQ')" class="more_details">more details</a>

使用视频网址在函数中设置 iframe 的 src

function popup(pPopup, pYt){ //pYt optional
    $('iframe').attr('src', pYt);
}

当您想要删除源时,请在代码中添加此行

$('iframe').attr('src', '');
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

网站 YouTube 嵌入视频不断播放 的相关文章

  • 使用JQuery检查元素是否有边框?

    所以我正在玩 el css 尝试确定元素是否有边框 我用 css border style solid 设置边框 这是可行的 但实际上它设置了 4 种单独的样式 border right style border left style bo
  • 如何仅使用CSS设置某个角的边框半径

    如上所示 我可以只给顶部部分而不给底部提供半径 或者有时给底部而不是顶部提供半径吗 有没有办法只给一个角提供边界半径 Like border radius top left top right bottom right bottom lef
  • Child_process 处理带有回车符 (\r) 的 STDOUT 流

    我正在编写一个简单的应用程序 它允许工作中的内部系统请求从远程服务器到使用 REST 调用发起的另一个远程服务器的复制过程 使用 rsync 我已经对express框架足够熟悉 并且刚刚开始尝试child process库 并偶然发现了一个
  • 通过 Javascript 将图像切割成碎片

    我正在创建一个简单的拼图游戏 为了做到这一点 我需要将我正在使用的图片切成 20 块 Javascript 有没有办法将一张图片切成 20 个相等的部分 并将它们保存为网页中的 20 个不同的对象 或者我只需要进入 Photoshop 自己
  • javascript中输入类型时间的值

    我有这个html
  • 默认情况下嵌入带字幕的 Youtube 不起作用

    我正在尝试嵌入 Youtube 电影 并希望默认情况下打开字幕 From https developers google com youtube player parameters cc load policy https develope
  • 使用 jquery 通配符检查 cookie 名称

    我有一个生成动态 cookie 的表单 例如 webform 62 1234356 62 1234356 可以是任意数字 我需要使用一些通配符检查来检查名称以 webform 开头的 cookie 是否存在 下面不起作用 if cookie
  • 嵌套辅助函数和性能

    嵌套辅助函数对于使代码更易于理解非常有用 谷歌甚至建议在他们的应用程序中使用嵌套函数时尚指南 https google styleguide googlecode com svn trunk javascriptguide xml Nest
  • express 或express-generator:我需要两者吗?

    只是探索 Node js 并遇到了 Express 在 npm 存储库站点上https www npmjs com package express https www npmjs com package express它明确指出安装是 np
  • 在overlayImage中应用滤镜的方法在哪里?

    我想在overlayImage中应用一个过滤器 唯一的方法是在渲染后在整个画布上应用过滤器 对此没有内置支持 但很容易 破解 var overlayImageUrl load overlay image first fabric Image
  • 有没有好的 JQuery twitter 小部件可以循环推文?

    我想知道是否有任何 JQuery 小部件提供了循环加载推文的功能 例如在官方小部件中http twitter com about resources widgets widget profile http twitter com about
  • 监听浏览器宽度以进行响应式网页设计?

    我正在努力使我的网站适合移动设备 我想知道浏览器窗口的大小 以便当它比 728px 窄时我可以执行某些操作 而当它大于 728px 时我可以执行其他操作 这必须考虑到调整 PC 上的窗口大小以及在手机中从纵向模式更改为横向模式 如何才能做到
  • 当条件评估为 true 时获取元素(扩展 ElementArrayFinder)

    我们有一个菜单 表示为ul gt li列表 简化 ul class dropdown menu li class ng scope a href class ng binding Menu Item 1 a li li li ul
  • React + Semantic-UI:在 UI MODAL 中使用表单

    在没有 React 的普通旧 Semantic UI 中 我已经能够毫无问题地将表单放入 Modal 中 使用 Semantic UI React 版本 我能够在模态中显示表单 但它并没有按照我期望的方式工作 例如 模态框显示后 模态框内的
  • 水平平滑滚动 100px

    Heyjo problem 一周以来我一直在寻找 javascript 或 jQuery 代码 以便在我的网站上实现滚动按钮 我失败的那一刻是按钮应该多次工作的时候 他的任务不是滚动到专用元素 而是应该向左滚动 例如 100px 此外 滚动
  • 为什么 JSON 结果可以是布尔值而不是对象或数组?

    From JSON 网站 http json org JSON 建立在两种结构之上 名称 值对的集合 在各种语言中 这被实现为对象 记录 结构 字典 哈希表 键控列表或关联数组 值的有序列表 在大多数语言中 这被实现为数组 向量 列表或序列
  • 为什么从浏览器上传到 S3 时出现 403 错误?

    因此 我尝试查看此处之前的答案 但似乎没有任何效果 我正在使用 Dropzone 它似乎发出 OPTIONS 请求来获取所有允许的 CORS 相关信息 但它似乎没有正确返回 因此 通过查看 Chrome 开发工具 我有以下请求标头 Host
  • 将 div 文本分配给变量然后显示它

    我有一个简单的任务 我试图完成学习 JavaScript 但一直无法找到明确的答案 这是代码 div Testing div 基本上我希望将方框 div 中的文本存储到变量中 然后 我想在页面的不同部分显示该变量的文本 使用上面的代码我得到
  • 为什么我的图像下方有空间? [复制]

    这个问题在这里已经有答案了 图像在下面获得了神秘的空白空间 即使padding 0 margin 0被应用 示范 http jsfiddle net cLETP 红色边框应该包围图像 但底部有空间 造成这种情况的原因是什么 如何删除该空间
  • WooCommerce 使用 AJAX 设置购物车数量?

    我已经为此绞尽脑汁好几天了 需要一些指导 我正在为 WooCommerce 网站完全从头开始制作自定义主题 现在我正在尝试让购物车功能正常工作 我一直试图使用按钮 来更新购物车中产品的数量 对我来说问题似乎是WC 我在functions p

随机推荐

  • 为什么 MSTest.TestAdapter 将其 DLL 添加到我的 NuGet 包中?

    我有带有一些自定义测试实用程序的 NuGet 包 它的项目正在引用MSTest TestFramework and MSTest TestAdapterNuGet 包和相应的依赖项在 nuspec 文件中指定 Files 部分仅指定要添加的
  • Swift 中具有透明背景的按钮边框

    我怎样才能做一个UIButton边框看起来像下图 入门 按钮一样具有透明背景吗 我应该如何使用情节提要来实现这一点 或者如何以编程方式实现这一点 设置backgroundColor to clearColor使按钮透明 例如尝试下面的代码
  • 在 Go 中,如何将结构体转换为字节数组?

    我有一个我定义的结构实例 我想将其转换为字节数组 我尝试了 byte my struct 但这不起作用 另外 我还被指出二进制包 http golang org pkg encoding binary 但我不确定我应该使用哪个函数以及应该如
  • 条件触发器的Django迁移sql

    我想创建一个触发器 仅在满足条件时插入表 我尝试过使用 IF BEGIN END 和 WHERE 的各种组合 但 Django 每次都会返回 SQL 语法错误 这里 type user id指的是触发该事件的人 user id指的是接收到通
  • 从表中选择行,其中另一个表中具有相同 id 的行在另一列中具有特定值

    在 MySQL 中 如果我们有两个表 comments key value 1 foo 2 bar 3 foobar 4 barfoo and meta comment key value 1 1 2 1 3 2 4 1 我想得到来自以下人
  • 在文本文件中搜索单词并返回其频率

    如何在包含单词文本的文本文件中搜索特定单词并返回其频率或出现次数 使用扫描仪 String text Question how to search for a particular word in a text file containin
  • 动态速度计 javascript 或 jquery 插件

    我希望有动态ajax插件在页面上显示速度计 一个想法是我设置一个背景并旋转针 有人知道相关插件吗 这里有一些供您参考 http bernii github com gauge js http bernii github com gauge
  • 4 级订阅嵌套在流星中

    我正在使用流星 这是我的架构 每个都是一个单独的集合 课程有很多讲座 讲座有很多问题 问题有很多答案 我想要一页可以显示给定课程的讲座 问题和答案 我可以毫无问题地显示课程的讲座 但在显示更多嵌套项目时遇到问题 我理想地希望拥有 讲座有 c
  • 更改 Sublime Text 2 中的“下一个文件”和“上一个文件”快捷方式

    我没有运气改变 Sublime 中切换文件的键绑定 有人知道这笔交易在这里吗 我想要实现的只是 cmd 和 cmd 显示下一个和上一个文件 然后我可以使用 tab 和 shift tab 进行所有缩进 keys super command
  • python future 和元组解包

    实现像使用 future 进行元组解包这样的事情的优雅 惯用的方法是什么 我有这样的代码 a b c f x y g a b z h y c 我想将其转换为使用期货 理想情况下我想写一些类似的东西 a b c ex submit f x y
  • 使用 msbuild 复制所有文件和文件夹

    只是想知道是否有人可以帮助我编写一些我正在尝试编写的 msbuild 脚本 我想要做的是使用 msbuild 将所有文件和子文件夹从一个文件夹复制到另一个文件夹 ProjectName gt Source gt Tools gt Viewe
  • 如何在 JSP 中导入类?

    我是一个完全的JSP初学者 我正在尝试使用java util List在 JSP 页面中 我需要做什么才能使用除以下类之外的类java lang 使用以下导入语句进行导入java util List 顺便说一句 要导入多个类 请使用以下格式
  • Objective C 如何将文本字段添加到导航栏中

    我正在尝试将文本字段添加到导航栏中 但它没有显示在模拟器中 我在 viewdidload 中按如下方式执行 UITextView textField UITextView alloc initWithFrame CGRectMake 0 0
  • 我怎样才能更多地了解Python的内部原理? [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我使用Python编程已经有半年多了 我对Python内部更感兴趣 而不是使用Python开发应用程序
  • WordPress 包含 SVG 文件错误

    我使用 PHP 和 WordPress 在本地主机上 我可以毫无问题地包含 SVG 文件 但在实时服务器上 我尝试包含一个 SVG 文件以便能够使用 CSS 对其进行样式设置 我收到此错误消息 Parse error syntax erro
  • 如何在 C++ 上检查某个键是否被按下

    我怎样才能检查 Windows 上是否按下了某个键 正如其他人提到的 没有跨平台的方法可以做到这一点 但在 Windows 上你可以这样做 下面的代码检查 A 键是否按下 if GetKeyState A 0x8000 Check if h
  • 使用 Sequelize 实现单表继承

    有没有办法使用sequelize来创建单表继承 我希望有一个用于购买和 PartialPurchase 模型的 STI 其中我将有一个类型字段 该字段为 Purchase 或 PartialPurchase 以及类 Purchasing 和
  • 如何使用 Spring Boot 在运行时配置 Micrometer 的监控系统

    我对一般指标尤其是微米很陌生 所以这可能是一个愚蠢的问题 千分尺在其上描述了自己主页 https micrometer io 作为 外观 没有供应商锁定 想想 SLF4J 但为了指标 具有 对 Netflix Atlas 的内置支持 这do
  • 使用 CognitoIdentityServiceProvider 的 adminCreateUser 方法的 AWS Lambda 函数突然失败

    在过去的几天里 我一直在使用 AWS Lambda 函数测试特定流程 并且在 Cognito 用户池中预注册后触发的 lambda 函数工作正常并很好地返回回调函数 但从昨天开始我就看到了以下错误 ntime node modules aw
  • 网站 YouTube 嵌入视频不断播放

    我正在使用 youtube 提供的 iframe 在我的网站上嵌入视频 我还使用了一个 css 弹出窗口 这是我从这个页面学到的http www pat burt com web development how to do a css po