【发布时间】：2013-07-01 15:13:50
【问题描述】：
我正在尝试将视频嵌入到我的网页中，该网页具有隐藏/显示 div 功能，隐藏/显示 div 有效，但嵌入的视频不起作用，在 Firefox 中，当我单击显示 div 的文本时包含的 YouTube 视频它只显示一个黑色补丁（我认为那是因为这是我背景的颜色）但是如果我在 Chrome 中启动它会显示一个白框，说找不到网页，而 IE 说它不能也可以找到网页。
我直接从 YouTube 视频中复制了嵌入代码，它使用了 '<iframe>' 标签而不是 '<object>' 标签，我不确定这是否与它有关。
这是我要嵌入的视频的嵌入代码：
<iframe width="640" height="360" src="//www.youtube.com/embed/1qNQHv6jdyY?rel=0" frameborder="0" allowfullscreen></iframe>
这是我目前为止的网页（尚未完成）：
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Index</TITLE>
<link rel="stylesheet" type="text/css" href="DubWin By Chris Mckee-Rogers.css">
<SCRIPT type="text/javascript">
function toggleShowHide(elementId) {
var element = document.getElementById(elementId);
if (element) {
if (element.style.display == "none")
element.style.display = "inline";
else
element.style.display = "none";
}
}
</SCRIPT>
</HEAD>
<BODY>
<div class="Container">
<img src="images/logo.png" alt="Logo">
<div class="Menu">
<a href="Index.html">Home</a> | <a href="artist-info.html">Artists Information</a> | <a href="songs-and-mixes.html">Songs And Mixes<a> | <a href="forms.html">Forms<a>
</div>
<DIV class="Con-text">
<h1 style="text-align: center;">Here you'll be able to hear a few of my personal selected mixes and tunes</h1>
<h2 onClick="toggleShowHide('12th Planet')">12th Planet</h2>
<div id="12th Planet" style="display:none">
<iframe width="640" height="360" src="//www.youtube.com/embed/1qNQHv6jdyY?" frameborder="0" allowfullscreen></iframe>
</div>
<br>
<h2 onClick="toggleShowHide('Bar 9')">Bar 9</h2>
<div id="Bar 9" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Bassnectar')">Bassnectar</h2>
<div id="Bassnectar" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Chase & Status')">Chase & Status</h2>
<div id="Chase & Status" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Digital Mystikz')">Digital Mystikz</h2>
<div id="Digital Mystikz" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('DJ Fresh')">DJ Fresh</h2>
<div id="DJ Fresh" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Doctor P')">Doctor P</h2>
<div id="Doctor P" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Flux Pavillion')">Flux Pavillion</h2>
<div id="Flux Pavillion" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Foreign Beggars')">Foreign Beggars</h2>
<div id="Foreign Beggars" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Gemini')">Gemini</h2>
<div id="Gemini" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Going Quantum')">Going Quantum</h2>
<div id="Going Quantum" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Kryptic Minds')">Kryptic Minds</h2>
<div id="Kryptic Minds" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Magnetic Man')">Magnetic Man</h2>
<div id="Magnetic Man" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('ModeStep')">ModeStep</h2>
<div id="ModeStep" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Mt Eden')">Mt Eden</h2>
<div id="Mt Eden" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Nero')">Nero</h2>
<div id="Nero" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Pendulum')">Pendulum</h2>
<div id="Pendulum" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Rusko')">Rusko</h2>
<div id="Rusko" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Skrillex')">Skrillex</h2>
<div id="Skrillex" style="display:none">
</div>
<br>
<h2 onClick="toggleShowHide('Sub Focus')">Sub Focus</h2>
<div id="Sub Focus" style="display:none">
</div>
</DIV>
</div>
<br>
</BODY>
</HTML>
感谢您的所有帮助。
【问题讨论】：
-
把
http:加到//www.youtube.com...上能用吗？ -
不知道，先给，等我知道了再报告。
-
如果你同时使用
http://和https://，Youtube 使用//www来兼容 - 如果你通过本地网络服务器运行它，它工作正常，即 Windows 上的 WAMP，但如果不是您只需使用file://协议在浏览器中打开文件 - stackoverflow.com/questions/9646407/… -
是的！你是个天才。该死的，为什么我没有想到这一切都准备好了。我一直在寻找年龄。非常感谢@doubleDown，我可以在这里给你代表吗？
-
@cm125192，你看过 Nick R 的评论了吗？实际上，它似乎比我的更正确。
标签： html iframe youtube embed html-object