Ютуб fancybox не будет работать

В настоящее время я пытаюсь сделать fancybox с видео на YouTube внутри. В настоящее время у меня есть еще пара fancybox на странице, но я не могу заставить этот fancybox работать, другие fancybox имеют класс fancybox-iframe или fancybox в зависимости от содержимого, если это поможет.

Ниже приведена ссылка, к которой я хочу добавить fancybox.

<a href="http://youtu.be/krlR2-YGk4sI" target="_blank"><span class="cta floatL">through the eyes of a bigsmile advert</span><span class="playIco floatL"></span></a>

Это iframe, который я помещаю в свой fancybox. Может кто-нибудь, пожалуйста, помогите мне?

<iframe width="420" height="345" src="http://www.youtube.com/embed/krlR2-YGk4sI?autoplay=1" frameborder="0" allowfullscreen></iframe>

Спасибо


html youtube fancybox fancybox-2
person user3074956    schedule 28.12.2013    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Вам не нужно размещать видео внутри iframe. Единственный html, который вам нужен, это ссылка на ваше видео, например:

<a class="fancybox" href="http://youtu.be/krlR2-YGk4sI" target="_blank">Open youtube</a>

Обратите внимание на класс fancybox в теге <a> (вы можете использовать любое другое имя класса, просто убедитесь, что вы привязываете правильный селектор к fancybox)

Затем добавьте на свою страницу помощник мультимедиа fancybox:

<script type="text/javascript" src="path/to/fancybox/files/helpers/jquery.fancybox-media.js"></script>

... и добавьте параметр helpers media API в свой пользовательский скрипт, например:

$(document).ready(function () {
    $('.fancybox').fancybox({
        helpers: {
            media: {}
        }
    });
});

См. JSFIDDLE

person JFK    schedule 28.12.2013