0

我有一个代码,可以在单击图像后启动 youtubevideo。问题是,Opera、Chrome 等。在单击之前启动图像后面的视频。火狐工作正常。

这是我的代码:

<div onclick="thevid=document.getElementById('thevideo'); thevid.style.display='block'; this.style.display='none'">
    <img style="cursor: pointer; margin-left: 89px;" src="./img/style/new/slider/XXXXXX.png" alt="" />
</div>
<div id="thevideo" style="display: none;">
    <iframe width="604" height="266" src="//www.youtube.com/embed/XXXXXXXX?rel=0&autohide=2&showinfo=0&controls=0&modestbranding=0&wmode=transparent&showsearch=0&version=3&autoplay=1" frameborder="0" allowfullscreen></iframe>
</div>

你能帮我写一个更好的代码吗?另外,视频结束后是否可以再次显示图像?

提前致谢

编辑:推

4

3 回答 3

0

看上面:

编辑:用编程方法处理它:将 youtube url 中的自动播放值更改为“autoplay=0”。向您的 iframe 添加一个 id 值,例如 id="iframe"。然后将以下代码行添加到图像的点击函数中: document.getElementById('iframe').src = document.getElementById('iframe').src.replace('autoplay=0','autoplay=1' );

这也可以在以下位置看到:Youtube Overlay Image Div - Autoplay Underneath

我用过,效果很好!

于 2013-09-20T21:10:24.470 回答
0

如果在用户单击图像时将 iframe 代码粘贴到#thevideo 会怎样?我认为您可以使用 jQuery 中的 .append() 函数来执行此操作。

于 2013-09-12T20:05:03.527 回答
0

chrome/opera...browser 问题是一个已知问题。您可以更改浏览器设置,使其不会自动播放视频,因为您实际上只是在视频上放置了一个遮罩。请参阅这篇文章:停止 youtube 自动播放

编辑:用编程方法处理它:将 youtube url 中的自动播放值更改为“autoplay=0”。向您的 iframe 添加一个 id 值,例如 id="iframe"。然后将以下代码行添加到图像的点击函数中: document.getElementById('iframe').src = document.getElementById('iframe').src.replace('autoplay=0','autoplay=1' );

这也可以在以下位置看到:Youtube Overlay Image Div - Autoplay Underneath

于 2013-09-12T21:44:46.030 回答