视频弹幕设计网站08-------video样式

简介: 视频弹幕设计网站08-------video样式


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

1、上一节我们把视频放到中间

2、上一节,我们把他放一半的弹幕,一般的视频

3、下面的是发送弹幕的内容,点击弹幕之后,就能把数据库发送到弹幕中

4、让他浮动在最左侧

5、让表单浮动在最右侧

6、视频文件放这里,弹幕文件放这里

7、这里我们要用Element-ui的表格

8、粘贴到我们表单域中的位置

9、在我们的main的vue中,我们把改为color

10、这里color的数据我们就将他改变了

11、找到我们的video,我们只需要两个栏

12、给他改一下弹幕内容

13、测试时间,测试弹幕2,我们把他放到数据库里就可以弹幕显示了

14、你按这个样式写的话,他就会是一个你点击一下,他就会把所有的内容全部收回去

15、那么我们可以看一下表单,因为我们要利用好自己的表单,将数据提交上去,后台就可以接受我们的数据

16、el-form 写moudle

17、

18、弹幕的具体数据

19、这里是表单的详细数据

20、最好的顺序是一模一样的

21、把表单数据填写上

22、首先提交第一个数据框

23、我们提交一个东西,就可以提交一个东西

24、

25、添加一个宽度

26、配置多少是刚好的

27、点击绑定事件,能够发送数据

28、

29、这个东西表示你不用点击,直接回车就能够发送数据

30、 这里的效果框没有写

31、点击发送,comment要相同,才能够完成校验

32、复制一下提交的所有的内容

这里是复制的内容

33、这里是调整颜色的配置

34、找到我们颜色的选择器

35、找到我们的颜色选择器

36、这里改为send.form

37、颜色的选择器跟我在同一行

38、要想改成同一个属性,给他inline属性

39、样式呈现出来了

40、设置最小缩放的尺寸

41、这里缩放的框,最小缩放框到多少,就得到多少数据



相关文章
|
JavaScript
element-plus 按需引入将英文组件修改为中文
element-plus 按需引入将英文组件修改为中文
element-plus 按需引入将英文组件修改为中文
|
Web App开发
Win系统 - 该扩展程序并未列在Chrome应用商店中怎么样办?(上)
Win系统 - 该扩展程序并未列在Chrome应用商店中怎么样办?(上)
2766 0
Win系统 - 该扩展程序并未列在Chrome应用商店中怎么样办?(上)
AutoJs曲线滑动---贝塞尔曲线
AutoJs曲线滑动---贝塞尔曲线
696 0
|
JavaScript Java API
如何接入阿里云短信服务 (完整指南)
如何接入阿里云短信服务 (完整指南)
58913 1
|
2月前
|
JavaScript 机器人 API
告别Token焦虑!零成本免费用OpenClaw攻略:阿里云/本地部署+百炼等免费大模型API配置指南
2026年,OpenClaw凭借强大的自动化能力成为AI工具圈的“香饽饽”,但很多用户都被同一个问题困扰——Token消耗过快,长期使用成本居高不下。轻度用户想尝鲜却担心钱包扛不住,重度用户面对持续上涨的费用更是头疼。
2752 0
|
10月前
|
NoSQL Linux Apache
2025年10大主流开源协议全解析与开源战略的商业价值-优雅草卓伊凡
2025年10大主流开源协议全解析与开源战略的商业价值-优雅草卓伊凡
1556 8
Vue2竖向文字滚动
这是一个基于Vue3的文字滚动组件(TextScroll),支持自定义滚动文字数组、滚动间隔时间、展示宽度及高度等属性。该组件通过VerticalTextSlider.vue实现,提供了平滑过渡动画,并允许鼠标悬停时暂停滚动。适用于多种场景下的文字轮播需求。
391 0
Vue2竖向文字滚动
Vue2时间轴(Timeline)
本文介绍了一个基于 Vue3 的时间轴组件 `Timeline`,允许用户自定义时间轴宽度和描述文本。通过在 `Timeline.vue` 中使用模板、脚本及样式代码,文章展示了如何创建并使用该组件,并提供了示例代码以供参考。
1442 2
Vue2时间轴(Timeline)
|
Web App开发 JSON JavaScript
WebGL简易教程(十五):加载gltf模型
WebGL简易教程(十五):加载gltf模型
663 1
|
JavaScript Java 测试技术
基于Java的二手交易平台的设计与实现(源码+lw+部署文档+讲解等)
基于Java的二手交易平台的设计与实现(源码+lw+部署文档+讲解等)
339 0