2014-08-21 4 views
0

Мое требование состоит в том, что на веб-странице есть два видеоролика .... Скажем, я играю один из них, и через несколько минут я начинаю играть дальше. Когда я играю на следующем видео, первый должен остановиться. В двух словах два видео не могут воспроизводиться одновременно, один или другой должны соответственно останавливаться.Остановить видео Vimeo, когда выполняется другое видео

До сих пор я сделал следующее .. Пожалуйста, направляйте меня дальше!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script src="Scripts\jquery-1.5.1.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script> 

<script src="http://a.vimeocdn.com/js/froogaloop2.min.js" type="text/javascript"></script> 

    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('iframe').each(function() { 
       var vidsrc = $(this).attr('src'); 
       vidsrc = vidsrc + "?api=1&player_id=" + $(this).attr('id'); 
       $(this).attr('src', vidsrc); 
      }); 

      $('iframe').each(function() { 
       $f(this).addEvent('ready', ready); 
      }); 
      function addEvent(element, eventName, callback) { 
       if (element.addEventListener) { 
        element.addEventListener(eventName, callback, false); 
       } 
       else { 
        element.attachEvent('on' + eventName, callback, false); 
       } 
      } 
      function ready(playerID) { 
       $f(playerID).api('play'); 
       $f(playerID).addEventListener('play', play(playerID)); 
      } 
      function play(playerID) { 
       $('iframe').each(function() { 
        if (this.id != playerID) { 
        //check if video is in play mode { 
         var vidsrc = $(this).attr('src'); 
         $(this).attr('src', ''); 
         $(this).attr('src', vidsrc); 
        //} 
        } 
       }); 
      } 

     }); 
    </script> 
</head> 
<body> 
    <iframe id="player1" class='vimeo' src="http://player.vimeo.com/video/7100569" width="500" height="281" frameborder="0"></iframe> 
    <iframe id="player2" class='vimeo' src="http://player.vimeo.com/video/240975" width="500" height="281" frameborder="0"></iframe> 
</body> 
</html> 
+0

почему у вас есть 3 версии JQuery загружена? –

+0

Это была ошибка ... Пожалуйста, проигнорируйте – poonam

ответ

0

Только одно видео должно воспроизводиться одновременно. Игрок Vimeo знает, чтобы остановить другой видеопроигрыватель, если он играет.

Вы можете просто включить сами плавающие фреймы:

<iframe id="player1" class='vimeo' src="http://player.vimeo.com/video/7100569" width="500" height="281" frameborder="0"></iframe> 
<iframe id="player2" class='vimeo' src="http://player.vimeo.com/video/240975" width="500" height="281" frameborder="0"></iframe> 

Вот демо без дополнительного JS http://jsfiddle.net/wvk9eom3/1/

+0

Я не испытываю эту функцию автоматической остановки, о которой вы говорите (в Firefox для OSX) –

+0

Право, в том числе только iframe, не помогает грустно. Протестировано и в IE, и в Chrome – poonam

Смежные вопросы