Question

我在SO和MediaElements的网站上看了一些其他资源，似乎没有任何工作。

我尝试制作一个JSFiddle，但它不会在IE8中加载： http://jsfiddle.net/RyzaV/

以下是代码：

<div id="video" class="box">
    <video width="200" height="155" style="width: 100%; height: 100%;" id="player1" controls="controls" preload="true">
        <source type="video/<?php echo $video_format; ?>" src="<?php echo $video_url; ?>" />
        <object width="200" height="155" type="application/x-shockwave-flash" data="http://s3.amazonaws.com/websites.retailcatalog.us/media/mediaelements/flashmediaelement.swf">
            <param name="movie" value="http://s3.amazonaws.com/websites.retailcatalog.us/media/mediaelements/flashmediaelement.swf" />
            <param name="flashvars" value="controls=true&file=<?php echo $video_url; ?>" />
        </object>
    </video>

   <link type="text/css" rel="stylesheet" href="//s3.amazonaws.com/websites.retailcatalog.us/media/mediaelements/mediaelementplayer.min.css" />
   <script type="text/javascript" src="//s3.amazonaws.com/websites.retailcatalog.us/media/mediaelements/mediaelement-and-player.min.js"></script>
   <script type="text/javascript" language="javascript">
        $('#video').find('video:first').mediaelementplayer({
            success: function(media, node, player) {
                $('#' + node.id + '-mode').html('mode: ' + media.pluginType);
            }
            , flashName: 'flashmediaelement-cdn.swf'
        });
    </script>
</div>

知道我错过了什么吗？这是参考页面：
http://www.mediaelementjs.com/#note2

Answer 1

你应该在head标签中加上以下几行：

<link type="text/css" rel="stylesheet" href="//s3.amazonaws.com/websites.retailcatalog.us/media/mediaelements/mediaelementplayer.min.css" />
<script type="text/javascript" src="//s3.amazonaws.com/websites.retailcatalog.us/media/mediaelements/mediaelement-and-player.min.js"></script>

然后，确保在mediaelement-and-player.min.js之前调用jQuery。

Answer 2

确定究竟是什么原因造成了问题，但以下内容最终有效（看起来object标签导致了问题）：

<div id="video" class="box">
    <video width="200" height="155" style="width: 100%; height: 100%;" id="player1" controls="controls" preload="true">
        <source type="video/<?php echo $video_format; ?>" src="<?php echo $video_url; ?>" />
    </video>

   <link type="text/css" rel="stylesheet" href="//s3.amazonaws.com/websites.retailcatalog.us/media/mediaelements/mediaelementplayer.min.css" />
   <script type="text/javascript" src="//s3.amazonaws.com/websites.retailcatalog.us/media/mediaelements/mediaelement-and-player.min.js"></script>
   <script type="text/javascript" language="javascript">
        $('#video').find('video:first').mediaelementplayer({
            success: function(media, node, player) {
                $('#' + node.id + '-mode').html('mode: ' + media.pluginType);
            }
            , flashName: 'flashmediaelement-cdn.swf'
        });
    </script>
</div>

＆＃34;下载文件＆＃34; IE8中的MediaElements.js视频

2 个答案: