视频直播--使用chimee-player.browser.js 直播 m3u8格式视频

最新推荐文章于 2024-06-14 08:20:46 发布

iT_MaNongZYQ

最新推荐文章于 2024-06-14 08:20:46 发布

阅读量754

点赞数

分类专栏：前端技术文章标签： html javascript 视频处理

本文链接：https://blog.csdn.net/iT_MaNongking/article/details/117062592

版权

前端技术专栏收录该内容

2 篇文章 0 订阅

订阅专栏

视频直播–使用chimee-player.browser.js 直播 m3u8格式视频亲测直接复制html 可播放采用hls 解析

<!DOCTYPE html>
<html>
	<head>
		<title>视频测试</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		
		<script src="http://lib.baomitu.com/chimee-player/1.1.9/chimee-player.browser.js"></script>
	</head>
	<body>
		<div class="video-box">
			<div id="wrapper" class="vidoe"></div>
			<!-- <hr style="height: 2px; border-color: #1F1F1F;"> -->
			<div id="wrapper2" class="vidoe"></div>
			<div id="wrapper3" class="vidoe"></div>
		</div>
		<div class="video-box">
			<div id="wrapper4" class="vidoe"></div>
			<div id="wrapper5" class="vidoe"></div>
			<div id="wrapper6" class="vidoe"></div>
			</div>
			<div class="video-box">
			<div id="wrapper7" class="vidoe"></div>
			<div id="wrapper8" class="vidoe"></div>
			<div id="wrapper9" class="vidoe"></div>
		</div>
		
	</body>
</html>
<script>
	new ChimeePlayer({
		wrapper: '#wrapper', // video dom容器
		src: 'http://ivi.bupt.edu.cn/hls/hunanhd.m3u8',
		box: 'hls',
		isLive: false,
		autoplay: false,
		controls: true
	});
	new ChimeePlayer({
		wrapper: '#wrapper2', // video dom容器
		src: 'http://ivi.bupt.edu.cn/hls/cctv1hd.m3u8',
		box: 'hls',
		isLive: false,
		autoplay: false,
		controls: true
	});
	new ChimeePlayer({
		wrapper: '#wrapper3', // video dom容器
		src: 'http://ivi.bupt.edu.cn/hls/cctv2.m3u8',
		box: 'hls',
		isLive: false,
		autoplay: false,
		controls: true
	});
	new ChimeePlayer({
		wrapper: '#wrapper4', // video dom容器
		src: 'http://ivi.bupt.edu.cn/hls/cctv3hd.m3u8',
		box: 'hls',
		isLive: false,
		autoplay: false,
		controls: true
	});
	new ChimeePlayer({
		wrapper: '#wrapper5', // video dom容器
		src: 'http://ivi.bupt.edu.cn/hls/cctv5phd.m3u8',
		box: 'hls',
		isLive: false,
		autoplay: false,
		controls: true
	});
	new ChimeePlayer({
		wrapper: '#wrapper6', // video dom容器
		src: 'http://ivi.bupt.edu.cn/hls/cctv6hd.m3u8',
		box: 'hls',
		isLive: false,
		autoplay: false,
		controls: true
	});
	new ChimeePlayer({
		wrapper: '#wrapper7', // video dom容器
		src: 'http://ivi.bupt.edu.cn/hls/btv1hd.m3u8',
		box: 'hls',
		isLive: false,
		autoplay: false,
		controls: true
	});
	new ChimeePlayer({
		wrapper: '#wrapper8', // video dom容器
		src: 'http://ivi.bupt.edu.cn/hls/dfhd.m3u8',
		box: 'hls',
		isLive: false,
		autoplay: false,
		controls: true
	});
	new ChimeePlayer({
		wrapper: '#wrapper9', // video dom容器
		src: 'http://ivi.bupt.edu.cn/hls/chchd.m3u8',
		box: 'hls',
		isLive: false,
		autoplay: false,
		controls: true
	});
</script>
<style type="text/css">
	.vidoe{
		width:50%;
		height: 50%;
		margin: 10px 10px;
		float: right;
		
	}
	.video-box{
		display: flex;
	}
</style>

iT_MaNongZYQ

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
视频直播--使用chimee-player.browser.js 直播 m3u8格式视频

视频直播–使用chimee-player.browser.js 直播 m3u8格式视频亲测直接复制html 可播放采用hls 解析<!DOCTYPE html><html> <head> <title>视频测试</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1
复制链接

扫一扫