我在灯箱上工作，通过在jquery上单击一个元素来打开一个窗口。
非常适用于图片，但如果我打开YouTube影片和玩，后，关闭窗口（显示：无），在背景的视频持续播放..
我用这个教程的灯箱。
YouTube视频嵌入为iframe。
关上窗户
$（“。js-modal-close，.modal-overlay”）。click（function（）{
$（“。modal-box，.modal-overlay”）。fadeOut（500，function（）{
$（“。 modal-overlay“）。remove（）;
}）;
}）;
我该如何解决我的问题？
步骤1.使用启用iframe APIenablejsapi=1并将其添加id到iframe：
<iframe id="player" src="https://www.youtube.com/embed/MxMBueIjtv0?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
步骤2.加载API并使用步骤1中的ID创建播放器。对于此演示，我使用了player（可能是一个错误的选择）：
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
/* probably should tie into the `onReady` event,
but for this demo's purpose it's unnecessary.
the video will probably be ready by the time
you get to the close button. */
player = new YT.Player('player');
}
步骤3.stopVideo在您的封闭模型片段中调用Function：
$(".js-modal-close, .modal-overlay").click(function() {
player.stopVideo(); /* you can optionally also set the video back
at the beginning with `player.seekTo(0);` */
$(".modal-box, .modal-overlay").fadeOut(500, function() {
$(".modal-overlay").remove();
});
});
文件：https : //developers.google.com/youtube/iframe_api_reference
示范：http : //jsfiddle.net/4f5dksj5/
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句