html5 video 定位播放,HTML5 video标签的播放控制

这篇文章主要介绍了HTML5 video标签的播放控制,本文讲解了获取影片总时长、播放、暂停、获取影片的播放时间和设置播放点、音量的获取和设置等内容,需要的朋友可以参考下

上一篇介绍了html5标签video(播放器)初始化需要做的一些工作,如何简单快速使用html5的播放器,本文将重点介绍如何用JS来操作video标签,也就是如何对video做一些简单基本的操作,包括了播放器的播放、暂停,音量的读取、设置等写相关操作,从而开始播放器的扩展之路。

本文的目录:

1.获取影片总时长

2.播放、暂停

3.获取影片已播放时间和设置播放点

4.音量的获取和设置

第一、获取影片总时长

对播放器(video)操作,首先要得到的是影片的一些信息,其中一个就是总时长,除了内容以为,总时长也是第一时间要显示的。在对video进行操作的的前先给video标签添加一个ID,这样方便我们获取video元素

poster="http://img0.ph.126.net/I10JqUUJDmlEtE_XYl4hOg==/6608842237655242020.jpg"

src="http://www.w3cschool.cc/try/demo_source/mov_bbb.mp4">

设置一个ID后,那么就可以开始操作了,要获取总时长,要用到video的一个事件-loadedmetadata,这个事件的触发表示元数据(媒体的一些基本信息)已经加载完成,用addEventListener监听事件var myVideo = document.getElementById('myVideo');//获取vide

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值