视频弹幕设计网站07-----------创建video

简介: 视频弹幕设计网站07-----------创建video


“希望你喜欢我的内容,记得关注我哦!我会继续为大家带来更好的作品!”

1、接下来我们来创建video这个样式,第一步,我们使用router-link跳转到其他页面,video页面,video页面就是用来看视频的

2、先创建我们vue页面

3、我们可以所有的数据都在video页面中进行显示

4、在这个页面传导部分参数

5、将这个页面注册进入

6、设置子路由

7、怎样点击他让他传参

8、把video的参数传递过去,这里添加?,就能够实现

9、路径的写法就是这样

10、video样式的写法,双引号给他阔进去

11、点击猫之后,就会出现猫传递cat,我点击猫一下

12、点击图片之后,就能够获取到id

13、跳转已经做完了,现在我们进行video页面的开发:

14、我们给他画一个弹幕画板

15、给他定义一个canvas样式

16、获取一个参数

17、获取到我们上面传参的参数

18、我们想把这个参数放到这里

19、通过他进行获取

20、他能够获取到video= 后面的值,这里了出现cat

21、这里video

22、把他的值赋值给id

23、这个链接就是我们的视频链接,我们可以对他进行一个拼接

24、拼接一个字符串

25、.mp4这里也添加上

26、定义一下我们video的样式

27、这里id,video将其创建出来

28、这里都是相同的,只有这样才能够做到弹幕和视频在同一个位置

相关文章
|
2月前
|
前端开发
web前端---------网页中的选项
web前端---------网页中的选项
39 0
|
3天前
|
数据库
视频弹幕设计网站10-----弹幕列表信息获取
视频弹幕设计网站10-----弹幕列表信息获取
视频弹幕设计网站10-----弹幕列表信息获取
|
3天前
|
XML SQL 前端开发
视频弹幕设计网站09-----发送弹幕到数据库
视频弹幕设计网站09-----发送弹幕到数据库
视频弹幕设计网站09-----发送弹幕到数据库
|
3天前
|
JavaScript 数据库
视频弹幕设计网站08-------video样式
视频弹幕设计网站08-------video样式
|
3天前
|
存储 前端开发 JavaScript
视频弹幕设计网站11-----绘制弹幕
视频弹幕设计网站11-----绘制弹幕
|
3天前
|
存储 前端开发
弹幕视频设计网站12------绘制弹幕02
弹幕视频设计网站12------绘制弹幕02
|
3天前
|
前端开发 JavaScript
弹幕视频设计网站13---------绘制弹幕03
弹幕视频设计网站13---------绘制弹幕03
|
3天前
|
前端开发 JavaScript
视频弹幕设计网站04--------header样式
视频弹幕设计网站04--------header样式
|
3天前
|
XML SQL 前端开发
视频弹幕设计网站05-------静态资源与接口
视频弹幕设计网站05-------静态资源与接口
|
3天前
|
前端开发
视频弹幕设计网站03-----main组件与样式
视频弹幕设计网站03-----main组件与样式