0.2.10 • Published 3 years ago
larkplayer-ui v0.2.10
larkplayer-ui
为 larkplayer 提供自定义样式
- 组件化
- 支持 jsx 语法
- 自适应 pc 与移动端
注意:此插件会修改 controls 方法:
- 修改前:player.controls() 返回或控制 video 标签的 controls 属性
- 修改后:player.controls() 返回或控制当前自定义样式是否展示。video 标签上的 controls 属性会被移除
*注意:此插件会新增 controlsshow controlshide 事件,用以同步控制条显隐状态
截图
PC
MOBILE
下载
NPM
npm install larkplayer-ui
CDN
<script src="https://unpkg.com/larkplayer-ui@latest/dist/larkplayer-ui.js"></script>
使用
script
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>larkplayer custom style</title>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0,user-scalable=no">
</head>
<body>
<video id="video-el" src="https://baikebcs.bdimg.com/baike-other/big-buck-bunny.mp4"></video>
<script src="https://unpkg.com/larkplayer@latest/dist/larkplayer.js"></script>
<script src="https://unpkg.com/larkplayer-ui@latest/dist/larkplayer-ui.js"></script>
<script type="text/javascript">
var width = Math.min(document.body.clientWidth, 640);
var player = larkplayer('video-el', {
width: width,
height: width * 9 / 16
});
</script>
</body>
</html>
模块化
import larkplayer from 'larkplayer';
import 'larkplayer-ui';
const player = larkplayer('video-el-id');
License
larkplayer-ui is MIT licensed
0.2.10
3 years ago
0.2.9
4 years ago
0.2.8
4 years ago
0.2.7
4 years ago
0.2.6
4 years ago
0.2.5
4 years ago
0.2.4
4 years ago
0.2.3
5 years ago
0.2.2
5 years ago
0.2.1
5 years ago
0.2.0
5 years ago
0.1.9
5 years ago
0.1.8
5 years ago
0.1.7
5 years ago
0.1.6
5 years ago
0.1.5
5 years ago
0.1.4
5 years ago
0.1.3
5 years ago
0.1.2
5 years ago
0.1.1
5 years ago
0.1.0
5 years ago
0.0.9
6 years ago
0.0.8
6 years ago
0.0.7
6 years ago
0.0.6
6 years ago
0.0.5
6 years ago
0.0.4
6 years ago
0.0.3
6 years ago
0.0.2
6 years ago