腾讯 video 引用
源码展示
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport"
content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui" />
<meta charset="UTF-8">
<link href="https://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
<title>使用JSAPI</title>
</head>
<body>
<div id="container"></div>
<p style="padding:10px">
<button type="button" class="btn btn-primary" onclick="player.play()">播放</button>
<button type="button" class="btn btn-success" onclick="player.pause()">暂停</button>
</p>
</body>
<!-- 使用相对协议，同时支持http和https -->
<script src='//vm.gtimg.cn/tencentvideo/txp/js/txplayer.js'></script>
<script>
var player = new Txplayer({
containerId: 'container',
vid: 'l0539vqs140',
width: '100%',
height: screen.availHeight / 3
});
player.on('ready', () => {
console.log('player ready');
});
player.on('volumeChange', (volume) => {
console.log('player volumechange:', volume);
});
player.on('playStateChange', (state) => {
console.log('player playStateChange:', state);
});
</script>
</html>