gpt4 book ai didi

javascript - 点击overlay div播放youtube视频

转载 作者:行者123 更新时间:2023-11-30 13:01:54 25 4
gpt4 key购买 nike

我有一个覆盖 youtube iframe 的占位符 div。我正在尝试单击占位符并使用 jquery 播放视频。这看起来很简单,但我一辈子都弄不明白。谁能帮我解决这个问题?

这是我正在使用的 html:

<div class="container">
<span class="placeholder"></span>
<iframe id="video width="560" height="315" src="http://www.youtube.com/embed/abqjFFtAPRo" frameborder="0" allowfullscreen></iframe>
</div>

谢谢!

最佳答案

为了加快速度,我建议您使用此功能。您需要一个带有视频源网址的按钮/链接。在 url 上,您需要传递参数“autoplay=1”。当您单击该元素时,将视频源放在您的 iframe 的属性“src”上;)Le 代码:

<html>
<head>
<script type="text/javascript">
$(document).ready(function(){
$("#loadVideo").bind("click", function(){
videoUrl = $(this).attr("data-video-src")
$("#video").attr("src", videoUrl)
});
});
</script>
</head>
<body>
<div class="container">
<button id="loadVideo" data-video-src="http://www.youtube.com/embed/abqjFFtAPRo?rel=0&autoplay=1">Load video</button>
<iframe id="video" width="560" height="315" src="" frameborder="0" allowfullscreen/>
</div>
</body>
</html>

关于javascript - 点击overlay div播放youtube视频,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17129455/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com