400-800-9385
网站建设资讯详细

前端开发之H5 video视频的使用

发表日期:2022-01-06 09:25:33   作者来源:严成   浏览:337   标签:前端开发    
自从Flash因为许多漏洞被谷歌禁用,现在的网站需要播放视频时,一般都是使用
标签,
标签是 HTML 5 的新标签。而且现代浏览器基本上都支持,如:Internet Explorer 9+, Firefox, Opera, Chrome 以及 Safari 支持
标签。
标签有许多属性可以使用,比如:autoplay(属性):autoplay(值),如果出现该属性,则视频在就绪后马上播放。controls(属性):controls(值),如果出现该属性,则向用户显示控件,比如播放按钮。height(属性):pixels(值),设置视频播放器的高度。loop(属性):loop(值),如果出现该属性,则当媒介文件完成播放后再次开始播放。muted(属性):muted(值),规定视频的音频输出应该被静音。poster(属性):URL(值),规定视频下载时显示的图像,或者在用户点击播放按钮前显示的图像。preload(属性):preload(值),如果出现该属性,则视频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性。src(属性):url(值),要播放的视频的 URL。width(属性):pixels(值),设置视频播放器的宽度。H5
标签的出现和使用这些属性极大方便我们前端处理视频的工作。
H5
标签还有两个重要的对象方法播放和暂停,play()和pause()。html如下图:
 
js如图:

前端JS代码1

前端JS代码2

这样一个简单的用户自己控制的视频就出来了。
如没特殊注明,文章均为方维网络原创,转载请注明来自https://www.szfangwei.cn/news/6317.html
前端相关公司评论
  • 2.驻点数据软件工程师、前端工程师、后端工程师、云业务专员(技术类岗位聘用人员为公司正式职工):试用期2个月,试用期工资按照转正工资的80%发放(试用期即签订正式劳动合同,开始购买社会保险);...
    思茅开发网站公司
  • 为什么说学习前端知识很有必要呢?一般情况下,ui设计师负责设计页面,然后和前端对接,如果ui人员不了解前端基本知识,那沟通难度就会很大。另外,ui设计师了解前端知识,也可以独...
    遵义系统开发公司