Crossbrowser 추가/제거 MediaElementJS 비디오

내가 사용하고 MediaElementJS http://mediaelementjs.com/ 내가 원하는 팝업을 숨겨서 처음부터 다시 재생할 수 있습니다.Crossbrowser 추가/제거 MediaElementJS 비디오

가능한 방법은 ... 다음 새 비디오 객체를 생성, 처음에 ... 다시

그것을 숨기고 다음, 그것을 보여주는 다음 비디오를 숨기거나 동적으로 삭제 후 비디오 객체를 생성 포함

하나 버전 : http://vc4hp.net/vidtest/test5.php

아이 패드 : 좋아, IE9 : 좋아, 크롬 : 확인

파이어 폭스 : "쇼"를 두 번 눌러야하고 소리가 없습니다. http://vc4hp.net/vidtest/test5f.php 처음에는 비디오를 숨김 대신 표시합니다 (자동 재생을 사용할 수 없습니다). 비디오를 바로 재생할 경우 ("표시"를 눌러야 함) 사운드가 작동합니다. 당신이 숨기고 그 후에 그것을 보여 주면, 소리는 작동하지 않습니다.

IE6-IE8 : "표시"를 두 번 눌러야합니다 ... 지연 시간이 너무 짧으면 비디오가 재생되지 않거나 사운드가있는 빈 화면이 없습니다. 지연이 충분하면 비디오가 정상적으로 재생됩니다. 때문에 파이어 폭스 문제에서 어떤 소리를

$(document).ready(function(){ 
    $('#videocontainer').hide(); 
    $("#show").click(function() { 
     $('#videocontainer').show('slow'); 
     if (nativeMP4) { 
      $('#player1').attr('src','comm5intro.mp4'); 
     } 
     else { 
      if (my_media.length > 0) { 
       my_media[0].setSrc('comm5intro.mp4'); 
       my_media[0].play(); 
      } 
     }   
    });  
    $("#hide").click(function() { 
     $('#videocontainer').hide('slow'); 
     if (nativeMP4) { 
      $('video')[0].pause(); 
     } 
     else { 
      if (my_media.length > 0) { 
       my_media[0].pause(); 
      } 
     }   
    });   
});

(I는 "연락처보기"중 하나 개를 누르을 요구하는 동시에 그 비디오의 그래픽을 표시 할 수 없었다), 나는 시도했다 다른 방법 - 비디오 객체 생성 및 파괴 :

http://vc4hp.net/vidtest/test11.php

아이 패드 : 확인

("쇼"영상을 표시한다 "숨기기"비디오 등을 사라 [물론하지 자동 재생 않습니다]한다)

IE9 : "표시"및 "숨기기"가 처음으로 작동합니다. "쇼"의 두 번째 언론은 한 번에 두 개의 비디오를 재생하며 "숨기기"를 누르면 삭제되지 않습니다.

Firefox : "표시"는 비디오를 표시하고 "숨기기"는 아무 것도하지 않습니다.

크롬 : "표시"는 일반적으로 에코를 생성합니다. 네이티브 MP4 지원이 감지되면 재생되는 두 번째 버전을 방지하기 위해 두 개의 비디오가 재생되는 것 같습니다. "숨기기"는 다른 비디오가 계속 재생 중임을 의미하는 반향을 중지합니다.

IE6-IE8 : Firefox와 마찬가지로 "표시"는 다른 비디오를 표시하고 재생을 시작합니다. "숨기기"는 아무 것도하지 않습니다.

$(document).ready(function(){ 
    $("#show").click(function() { 
     $('#videocontainer').append('<video id="player1" width="640" height="460" src="comm5intro.mp4" type="video/mp4" controls="controls" autoplay="true"></video>'); 
     var v = document.createElement('video'); 
     if (v.canPlayType && v.canPlayType('video/mp4').replace(/no/, '')) { 
      // native MP4 support 
      alert('Native MP4 Support'); 
     } 
     else { 
      $('#videocontainer video').mediaelementplayer({features: ['playpause','progress','volume']}); 
     } 
    });  
    $("#hide").click(function() { 
     $('#videocontainer video').remove(); 
    });  
});

나는 일을하고 싶은 이들 방법 모두는 가능한 한 그 브라우저의 많은에서 제대로 작동 할 수 있습니다. 버튼이 IE7과 IE8에서 작동하지 않는 있지만 여기

는

http://vc4hp.net/vidtest/test.html

... 내가 확인 모든 브라우저에서 제대로 비디오를 재생하는 버전입니다.

여기에 주요 파일의 압축이 있습니다 ....http://vc4hp.net/vidtest/mediaelementjs.zip

출처

2012-06-16 Luke Wenke