mediaelementjs是一个灵活的Flash播放器

时间:2012-09-25 01:29:07

标签: html5-video

我有一个使用固定大小的Flash播放器播放的Flash视频库。我想使用mediaelementjs至少拥有一个我可以选择大小的播放器 - 以及后续阶段添加响应大小和移动播放选项的视图。

我已将网站上的示例最小化,但它根本不播放示例文件。

<html>
    <head>
        <code>
            <script src="mediaelementjs/jquery.js"></script>
            <script src="mediaelementjs/mediaelement-and-player.min.js"></script>
            <link rel="stylesheet" href="mediaelementjs/mediaelementplayer.css" />
        </code>
    </head>
    <body>

        <div class="myvids" id="viddivap1" width="50%" style="width:100%;position:relative;">
        <video width="320" height="240" controls="controls" preload="none" style="max-width:100%;height:100%;">
            <!-- Flash fallback for non-HTML5 browsers without JavaScript -->
            <object width="320" height="240" type="application/x-shockwave-flash" data="mediaelementjs/flashmediaelement.swf">
                <param name="movie" value="mediaelementjs/flashmediaelement.swf" />
                <param name="flashvars" value="controls=true&file=echo-hereweare.mp4" />
                <!-- Image as a last resort -->
                <img src="myvideo.jpg" width="320" height="240" title="No video playback capabilities" />
            </object>
        </video>
        </div>

    </body>

</html>

1 个答案:

答案 0 :(得分:1)

您的示例缺少“来源”标记:

<html>
    <head>
        <code>
            <script src="mediaelementjs/jquery.js"></script>
            <script src="mediaelementjs/mediaelement-and-player.min.js"></script>
            <link rel="stylesheet" href="mediaelementjs/mediaelementplayer.css" />
        </code>
    </head>
    <body>
        <div class="myvids" id="viddivap1" width="50%" style="width:100%;position:relative;">
        <video width="320" height="240" controls="controls" preload="none" style="max-width:100%;height:100%;">
            <source type="video/mp4" src="echo-hereweare.mp4" />
            <!-- Flash fallback for non-HTML5 browsers without JavaScript -->
            <object width="320" height="240" type="application/x-shockwave-flash" data="mediaelementjs/flashmediaelement.swf">
                <param name="movie" value="mediaelementjs/flashmediaelement.swf" />
                <param name="flashvars" value="controls=true&file=echo-hereweare.mp4" />
                <!-- Image as a last resort -->
                <img src="myvideo.jpg" width="320" height="240" title="No video playback capabilities" />
            </object>
        </video>
        </div>
    </body>
</html>