Можно ли запускать видео bitsontherun.com в shadowbox.js? - PullRequest
0 голосов
/ 28 апреля 2011

Я использую bitsontherun.com для размещения и трансляции своих видео.Он использует последнюю версию проигрывателя JW, но проигрыватель обрабатывается bitsontherun.Я также использую shadowbox.js для моей галереи изображений продукта.Я хочу также интегрировать видео о моем продукте в галерею.Тем не менее, я не могу понять, как создать видео с сайта shadowontherun.Обычно я встраиваю эти видео на страницу, используя тег сценария, подобный следующему:

<script src="http://content.bitsontherun.com/players/ThWcjaxZ-qLFOERCo.js" type="text/javascript"></script>

Shadowbox.js обычно использует ссылку с миниатюрой изображения для запуска лайтбокса и связанного проигрывателя.У кого-нибудь есть идеи, как заставить это работать?

Ответы [ 2 ]

1 голос
/ 04 мая 2011

Да. Вот базовая реализация.

<!DOCTYPE HTML>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="shadowbox-3.0.3/shadowbox.css">
        <style>
            .botrplayer {display: none}
        </style>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
        <script type="text/javascript" src="shadowbox-3.0.3/shadowbox.js"></script>
        <script type="text/javascript">
            Shadowbox.init({
                skipSetup: true
            });
            $(document).ready(function(){
                Shadowbox.setup($('.sbox'));//set up links with class of sbox
                $('a.sbox').live('click',function(event){
                    Shadowbox.open({
                        content:    $(this).siblings('.botrplayer').html(),
                        player:     'html',
                        title:      "Welcome",
                        height:     280,
                        width:      490
                    });
                    //Stops loading link
                    event.preventDefault();

                });
            });
        </script>
        <title>bitsontherun shadowbox</title>
    </head>
    <body>
        <p>The content of the document......</p>
        <div>
            <a href="#" class="sbox">Open bitsonthe run video</a>
            <script type="text/javascript" src="http://content.bitsontherun.com/players/qgGMXVzB-Zdb9K7JT.js"></script>
        </div>
    </body>
</html>

Если вы оберните свои ссылки в div элементами script, вы можете повторно использовать этот код для всех них.

Размещено здесь: http://sandbox.jamesfishwick.com/bitsontherun/index.html

0 голосов
/ 28 октября 2013

Вы также можете использовать swf-версию видео (см. http://developer.longtailvideo.com/botr/system-api/urls/players.html) и ссылку на нее с помощью обычного shadowbox (http://www.shadowbox -js.com / use.html )

<link rel="stylesheet" type="text/css" href="shadowbox.css">
<script type="text/javascript" src="shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init();
</script>
<a href="http://content.bitsontherun.com/players/ThWcjaxZ-qLFOERCo.swf" rel="shadowbox">video</a>
...