zyMedia系列之播放视频

---

1、引入zy.media.min.js

<script src="zy.media.min.js"></script>

2、引入zy.media.min.css

<link rel="stylesheet" href="zy.media.min.css">

3、编写HTML

<div class="playvideo">
	<div class="zy_media">
		<video data-config='{"mediaTitle": "小蝴蝶"}'>
			<source src="mov.mp4" type="video/mp4" />
			您的浏览器不支持HTML5视频
		</video>
	</div>
	<div id="modelView">&nbsp;</div>
</div>

4、编写CSS，为HTML赋予样色

#modelView {
    
	background-color: #dddddd;
	z-index: 0;
	opacity: 0.7;
	height: 100%;
	width: 100%;
	position: relative;
}
.playvideo {
    
	padding-top: auto;
	z-index: 9999;
	position: relative;
	width: 300px;
	height: 200px;
}
.zy_media {
    
	z-index: 999999999;
}

5、调用zyMedia

<script>
	zymedia("video", {
    
		autoplay: false
	});
</script>

---

后记

如果你感觉文章不咋地//(ㄒoㄒ)//，就在评论处留言，作者继续改进；o_O???
如果你觉得该文章有一点点用处，可以给作者点个赞；\\*^o^*//
如果你想要和作者一起进步，可以微信扫描二维码，关注前端老L；~~~///(^v^)\\\~~~
谢谢各位读者们啦(^_^)∠※！！！