-
Notifications
You must be signed in to change notification settings - Fork 0
/
example.html
66 lines (58 loc) · 1.75 KB
/
example.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv='X-UA-Compatible' content='IE=edge'/>
<meta name="renderer" content="webkit"/>
<title>hls播放器</title>
<!-- <link rel="stylesheet" href="http://apps.bdimg.com/libs/typo.css/2.0/typo.min.css"> -->
<link rel="stylesheet" href="/dist/hls.min.css">
<style>
html {
background-color: #333;
}
.video-js {
margin: 0 auto 0;
}
</style>
</head>
<body>
<video id="my-video" class="video-js vjs-default-skin" width="640" height="360">
</video>
<script src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="./dist/video.js"></script>
<!--[if (gt IE 9) & (!IE)]>-->
<script src="./dist/hls.js"></script>
<!--<![endif]-->
<script>
var m3u8 = 'http://tblivestream.baidu.com/live/6d5dcff7a25d5e4238e079465dc62948_1024.m3u8?room_id=5000009&sign=d16bfe62af4b26688fdc09ce8b434a0e&bduss=Mfby%2BrzLKp%2B9AnMHefb47Y8zdkhaRKBLEtm7IoqWDSdj9GRh1dlMdlo5rukqymkZMMIKIMpd2i4RGDUlvqOjloKh6iofXWe1uL%2BSAmnj7yip6%2BszxmOG6QKF%2FTi4pP55oh18KK4btl9dXvwFU8h4E2VejPVrmi253NmvSuujo7e1AHvQ6lhqJBv%2FjUzSw1UOesQhARDtOmRPzZEXUJ4nf4qrcKncWUCWgOeNF%2BUt8CbWj0czfd1vvBhnbpppNj5t';
var src = [{
src: m3u8,
label: '默认',
res: '默认',
}, {
src: m3u8,
label: '1080p',
res: '1080p',
'data-res': "HD",
'data-default': true
}, {
src: m3u8,
label: '720p',
res: '720p',
'data-res': "SD",
}, {
src: m3u8,
label: '480p',
res: '480p',
}, {
src: m3u8,
label: '200p',
res: '200p',
}];
var player = hls('my-video', {
src: src
}, function () {});
</script>
</body>
</html>