相比 vue-video 视频播放器,Amalia.js 视频播放器功能更加丰富。它是一款基于 HTML5 的视频播放器。
Amalia.js 官网:http://ina-foss.github.io/amalia.js/。大家可以到它的官网上下载对应的插件,官网提供的也有详细 demo 和 api 使用说明。
安装 Amalia.js
$ bower install $ npm install $ grunt
快速使用 Amalia.js
首先在网页的 head 部分引入 Amalia.js。
<script type="text/javascript" src="bower_components/jquery/dist/jquery.js"></script> <script type="text/javascript" src="bower_components/jquery-ui/jquery-ui.min.js"></script> <script type="text/javascript" src="bower_components/raphael/raphael.js"></script> <link href="build/css/amalia.js.min.css" type="text/css" rel="stylesheet" /> <script src="build/js/amalia.js.min.js" type="text/javascript"></script>
Amalia.js 默认语言为法语。如果您需要一个英文版本,您必须在<head>节中添加翻译JavaScript文件:
<script type="text/javascript" src="build/js/player-message-en.js"></script>
中文做法类似。然后在网页的 <body>中加入如下代码:
<div style="height: 350px;"> <div id="myplayer"></div> </div>
然后再引入如下 JavaScript 代码,创建 视频播放器:
<script> $("#myplayer").mediaPlayer({ autoplay : false, src : "samples-data/examples/vid/amalia01.mp4", }); </script>
到这里一个完整的 视频播放器 就创建完成了。跟多使用参数和用法请参考:http://ina-foss.github.io/amalia.js/
: » Web 视频播放器 Amalia.js
原创文章,作者:奋斗,如若转载,请注明出处:https://blog.ytso.com/251209.html