Fancybox открывает пустую страницу с API YouTube

Fancybox работает нормально, когда я помещаю ссылку типа «http://www.youtube.com/embed/WQNQU_EQy6I», но я загружаю видео с канала YouTube, а ссылки на видео имеют вид «http://www.youtube. com/watch?v=Neff9scaCCI&feature=youtube_gdata", и fancybox не работает с этими ссылками.

Пожалуйста помоги.

JS -

<script type="text/javascript">
            $(document).ready(function() {
                $(".various").fancybox({
                    maxWidth    : 800,
                    maxHeight   : 600,
                    fitToView   : false,
                    width       : '70%',
                    height      : '70%',
                    autoSize    : false,
                    closeClick  : false,
                    openEffect  : 'elastic',
                    closeEffect : 'none'
                });
            });
</script>

HTML -

<a class="various fancybox.iframe" href="http://www.youtube.com/watch?v=Neff9scaCCI&feature=youtube_gdata">Video</a>

РЕШЕНИЕ: я использовал это, чтобы решить проблему. В $vd хранится URL-адрес видео, и с помощью этого кода я преобразовал эту ссылку в рабочую.

$vd = preg_replace('/.+(\?|&)v=([a-zA-Z0-9]+).*/', 'http://youtube.com/embed/$2', $vd); 

А потом использовал его

<a class="various fancybox.iframe" href="<?php echo $vd;?>">Video</a>

Надеюсь, это поможет кому-то вроде меня найти решение этой проблемы.


person linpar    schedule 20.01.2013    source источник
comment
ваше решение могло бы быть проще, если бы вы просто добавили помощника мультимедиа fancybox. /а>   -  person JFK    schedule 21.01.2013
comment
Я пробовал это, но это тоже не сработало.   -  person linpar    schedule 23.01.2013


Ответы (1)


Вам нужно использовать функцию мультимедиа fancybox. Попробуйте изменить свой JS на:

    $(document).ready(function() {
    $('.fancybox-media').fancybox({
        openEffect  : 'none',
        closeEffect : 'none',
        helpers : {
            media : {}
        }
    });
});

И попробуйте изменить ссылку на:

<a class="fancybox-media" href="http://www.youtube.com/watch?v=opj24KnzrWo">Video</a>

Для получения дополнительной информации посетите веб-сайт fancybox: http://www.fancyapps.com/fancybox/#examples< /а>

Надеюсь, это поможет!

person user1925621    schedule 20.01.2013