1

有没有人有一个成功的使用 mediaelement.js 的多视频画廊的 URL，其中相同的 MediaElementPlayer 实例被重用，并让它与 IE8 和 7 的 Flash 后备一起工作？

在第一次创建新的 MediaElementPlayer 后，我将 setSrc 作为函数更改为部分成功。这对于 HTML5 组件是健壮的，但对于 Flash 回退却失败了。setSrc 正在安慰 IE8 和 7 中不可用。它无法识别对象。

将 setSrc 移动到新 MediaElementPlayer 的“成功”部分确实会按预期加载 Flash 后备和 HTML5 视频。在尝试更改播放器的来源时，我试图“销毁”并即时重新创建 MediaElementPlayer 对象，但没有成功。我没有声明播放器使用var=player如此合理地期望删除它但没有成功：

player = false;
delete player;

//make a new instance of the mediaelement video player
player = new MediaElementPlayer('#videoPlayer', {
   pluginPath: ''+basePath+'_Includes/JS/',
   success: function (player, node) {
   //set the size (for flash otherwise no video just sound!)
   if($("#rg-gallery.smallGallery").length > 0){
        player.setVideoSize(400, 225);
   } else{
        player.setVideoSize(640, 360);
   }
   player.setSrc([   
      { src: mp4, type: 'video/mp4' },
      { src: webm, type: 'video/webm' }
   ]);       
   player.load();
   player.pause();


   //if the video plays stop the slideshow
      player.addEventListener('play', function () {
      videoPlaying.push('playing');
      stopSlideshow();
      }, false);
   }
});

此处和网络上的研究表明，其他人正在尝试尝试这种类型的动态画廊，但我无法找到表明它在技术上可行的示例。

有人破解它的任何示例 URL 都会很可爱。谢谢 ：）

4

1 回答 1

1

解决了。

创建了一个视频代码的JS变量：

var playerView = '<video width="640" height="360" id="videoPlayer" class="video-js vjs-default-skin" poster="" controls preload="auto"><source id="mp4" type="video/mp4" src="" /><source id="webm" type="video/webm" src=""  /></video>';

在初始化时删除任何现有播放器的任何 DOM 渲染，将其设置为 false 并删除它：

//remove any existing video player
$(".mejs-container").remove();
player = false;
delete player;

将新的视频视图附加到 DOM：

//add a new one
$(".rg-video").append(playerView);

创建播放器的新实例并设置 src 并正常加载：

//make a new instance of the mediaelement video player
player = new MediaElementPlayer('#videoPlayer', { ...

IE8 和 7 的 HTML5 视频和 Flash 视频回退现在作为动态混合媒体库的一部分。

去喝茶和奖牌。

:)

于 2012-08-01T12:52:12.940 回答