Как я могу запустить видео из трубки в colorbox?

Question

Я пытаюсь использовать плагин jquery colorbox ( http://www.jacklmoore.com/colorbox/) для запуска видео с YouTube в лайтбокс.

Это прекрасно работает на странице примеров на веб-сайте colorbox, но когда я пробую его на своем веб-сайте, я не работаю.

В консоли нет ошибок, и лайтбокс открывается ни с чем.

Пример здесь: http://codeplay.azurewebsites.net/colorbox/index.html

Вот как я запускаю colorbox:

$.colorbox({
href: 'http://www.youtube.com/embed/v0EsVMAyZdI',
iframe: true,
maxWidth: "80%",
maxHeight: "80%"
});

Есть идеи, что не так?

Answer 1

Ты уже решил это?

Если нет, вот кусок:

<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>

Взято с: http://www.jacklmoore.com/colorbox/faq/

Answer 2

К сожалению, вы должны указать свойство width и height для элементов iframe. Colorbox не может измерить, насколько большим должен быть iframe, как и другие типы контента, потому что он не зависит от того, что загружается внутри iframe.

Answer 3

Сделайте это по вашей ссылке:

<a class="youtube cboxElement" href="http://www.youtube.com/embed/VOJyrQa_WR4?rel=0&amp;wmode=transparent">Flash / Video (Iframe/Direct Link To YouTube)</a>

и в JS:

$(".youtube").colorbox({iframe:true, innerWidth:640, innerHeight:390});

Также посмотрите исходный код этой страницы, на котором есть много примеров: http://www.jacklmoore.com/colorbox/example2/