javascript 彩盒帮助!嵌入 YouTube 视频

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12714313/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 16:57:47  来源:igfitidea点击:

Colorbox help! Embed a youtube video

javascripthtmlembedcolorbox

提问by matt hoover

I am completely new to javascript and using colorbox. I can get the video to load and close as I would like. However, I don't know how to change the formating of the box or how to make the background more opaque while the pop-up apears. I have the following code:

我对 javascript 和使用 colorbox 完全陌生。我可以根据需要加载和关闭视频。但是,我不知道如何更改框的格式或如何在弹出窗口出现时使背景更加不透明。我有以下代码:

{js}

<br>
<br>
<h1>hello world! This is soooooo exciting! </h1>

<p><a href="javascript:void jQuery.colorbox({
            html:'<iframe width=600 height=400 src=http://www.youtube.com/embed/eh-0knDpn5g frameborder=10 allowfullscreen></iframe>'
                })"> <img src="/uploads/features/featured-block-1.jpg" /></a></p>

Also I have been having this weird problem where I close the pop-up, but the background still stays opaque.

此外,我在关闭弹出窗口时遇到了这个奇怪的问题,但背景仍然不透明。

If anyone could post some code examples or explain to me how/if the colorbox takes parameters, I would greatly appreciate it.

如果有人可以发布一些代码示例或向我解释颜色框如何/是否接受参数,我将不胜感激。

回答by webdeveloper

All options you can find on this page: ColorBox

您可以在此页面上找到的所有选项:ColorBox

Here is example:

这是示例:

$.colorbox({ href: 'http://www.youtube.com/embed/eh-0knDpn5g', width: '600px', height: '400px', iframe: true });

回答by webdeveloper

<a class='youtube' href='http://www.youtube.com/watch?v=VOJyrQa_WR4'>Business Cats</a>
<script>
    $('.youtube').colorbox({iframe: true, width: 640, height: 390, href:function(){
        var videoId = new RegExp('[\?&]v=([^&#]*)').exec(this.href);
        if (videoId && videoId[1]) {
            return 'http://youtube.com/embed/'+videoId[1]+'?rel=0&wmode=transparent';
        }
    }});
</script>