Как остановить видео в ie8 при скрытии div? - PullRequest
0 голосов
/ 19 марта 2012

Я написал некоторый JavaScript, который будет отображать видео, когда кто-то нажимает на изображение, а затем он может нажать «x», чтобы закрыть видео, но видео продолжает воспроизводиться в ie8, когда скрыто, но останавливается в FireFox и Chrome. Если кто-нибудь подскажет, как это исправить, остановив видео при нажатии на изображение «xbutton», я был бы очень признателен, если бы боролся с этим часами. Вот что у меня так для JavaScript:

    function toggle(div_id) {
       var el = document.getElementById(div_id);
       if ( el.style.display == 'none' ) {  el.style.display = 'block';}
       else {el.style.display = 'none';}    }

    function blanket_size(popUpDivVar) {
      var blanket = document.getElementById('blanket');
      blanket_height = document.body.parentNode.scrollHeight;           
      blanket.style.height = blanket_height + 'px'; 
          }

    function popup(windowname) {
       blanket_size(windowname);    
       toggle('blanket');
       toggle(windowname);  
           }

и это HTML, который я использую. Я просто использую Dreamweaver для добавления видеофайла .flv с моего компьютера.

    <div id="blanket" style="display:none;"></div>
    <div id="popUpDiv" style="display:none;">
    <a href="#popUpDiv" onclick="popup('popUpDiv')"><img 
    src="../New images/newxbtn-red.png" class ="xbutton" alt = "Close"/></a>
    <p> Video Header</p>
    <!--Dreamweaver video code starts here -->
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="622"
    height="350" id="FLVPlayer">
    <param name="movie" value="FLVPlayer_Progressive.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="opaque" />
    <param name="scale" value="noscale" />
    <param name="salign" value="lt" />
    <param name="allowScriptAccess" value="always" />
    <param name="FlashVars" 
    value="&amp;MM_ComponentVersion=1&amp;skinName=Halo_Skin_3&amp;streamName=video/bf-
    eng&amp;autoPlay=true&amp;autoRewind=false" />
    <param name="swfversion" value="8,0,0,0" />
    <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download 
    the latest version of Flash Player. Delete it if you don’t want users to see the 
    prompt. -->
    <param name="expressinstall" value="Scripts/expressInstall.swf" />
     <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
     <!--[if !IE]>-->
     <object type="application/x-shockwave-flash" data="FLVPlayer_Progressive.swf"  
     width="622" height="350">
     <!--<![endif]-->
    <param name="quality" value="high" />
    <param name="wmode" value="opaque" />
    <param name="scale" value="noscale" />
    <param name="salign" value="lt" />
    <param name="allowScriptAccess" value="always" />
    <param name="FlashVars"  
    value="&amp;MM_ComponentVersion=1&amp;skinName=Halo_Skin_3&amp;streamName=video/bf-  
    eng&amp;autoPlay=true&amp;autoRewind=false" />
    <param name="swfversion" value="8,0,0,0" />
    <param name="expressinstall" value="Scripts/expressInstall.swf" />
    <!-- The browser displays the following alternative content for users with Flash 
    Player 
    6.0 and older. -->'
    <div>
   <p><a href="http://www.adobe.com/go/getflashplayer"><img 
   src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"  
   alt="Get Adobe Flash player" /></a></p>
   </div>
   <!--[if !IE]>-->   
   </object>
   <!--<![endif]-->
   </object>
    <!-- Video Ends -->
     </div>
     <div class ="image">   
     <a href="#popUpDiv" onclick="popup('popUpDiv')">
     <img src="img/farmers/Donahue_Beef.jpg" width="190" height="110" alt="Beef" />
     <img src="../New images/playbtn.png" width="200" height="116" alt="Play" class = 
     "play"/></a>
     </div>

Еще раз спасибо!

Ответы [ 2 ]

3 голосов
/ 06 декабря 2012

Может быть очень простой способ использования jQuery.В моем случае я сгенерировал встроенный элемент flash с объектом в нем.С помощью jQuery вы можете легко определить кнопку закрытия с помощью функции empty().Это очищает содержимое div, и видео больше не находится в DOM.

$("#video a.close").click(function(){
 $("#flashlayer").empty();
}
1 голос
/ 20 марта 2012

Сначала вам нужно будет прослушать событие click в элементе xbutton (к которому я рекомендую добавить идентификатор):

function listen(event, elem, func) {
  if (elem.addEventListener) {
    elem.addEventListener(event, func, false);
  } else if (elem.attachEvent) {
    elem.attachEvent(event, func);
  }
}

listen('load', window, function() {
  var xbutton = document.getElementById('xbutton');
  var player = document.getElementById('FLVPlayer');
  listen('click', xbutton, function(e) {
    player.Stop();
    e.preventDefault();
  });
});

Вы можете использовать метод JavaScript Stop(), чтобы остановить Flash-видео.

...