作者:mobiledu2502912677 | 来源:互联网 | 2023-01-30 17:31
Javascript之类操作:HTML5 canvas多分屏示例
发布时间:2018-09-20 12:40,
浏览次数:533
, 标签:
Javascript
HTML
canvas
HTML5中用户播放视频的方式:Canvas可以渲染图像播放,Video可以播放视频源数据。这里通过Javascript的类来写一个多分屏的画布效果,Video标签的类似。目标要求:(1)实现canvas对象的选择边框效果(2)实现多分屏的切换,支持1、4、6、9、10、16等分屏。
实现源码
for="cmbScreenNumbers">分屏数量:
οnchange="Screens(this.value)"> 1=1x1
value="4" selected="selected">4=2x2
6=2x3
9=3x310=1+9
value="16">16=4x4
效果展示
1分屏:
4分屏:
6分屏:
9分屏:
10分屏:
16分屏:
html5 canvas:http://www.runoob.com/html/html5-canvas.html
真实视频播放