videojs文档翻译-SeekBar
SeekBar
拖动条和进度条的容器。 使用PlayProgressBar作为其栏。
构造函数
new SeekBar(player, optionsopt)
创造此类的实例
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
player |
Player |
The |
|
options |
Object | <optional> |
The key/value store of player options. |
延伸
- Slider
成员
playerEvent :string
-
当播放器发生此事件时,调用此滑块的更新事件。
方法
calculateDistance(event) → {number}
-
计算滑块距离
参数:
Name Type Description eventEventTarget~Event 导致此函数运行的事件。
返回:
number -
滑块的当前位置。
- postition.x for vertical `Slider`s 用于垂直滑块
- postition.y for horizontal `Slider`s 用于水平滑块- 继承自:
-
- Slider#calculateDistance
createEl() → {Element}
-
创建此组件的DOM元素
Returns:
Element -
创建的元素。
- Overrides:
-
- Slider#createEl
getPercent() → {number}
-
获取到目前为止已播放媒体的百分比。
返回:
number -
到目前为止播放的媒体的百分比(0到1)。
handleAction(event)
-
切换播放器的播放状态,当在seekbar上使用enter或空格时会调用
参数:
名称 类型 描述 eventEventTarget~Event 导致此函数被调用的按键事件
handleBlur(event)
-
处理此滑块上的
blur事件。参数:
名称 类型 描述 eventEventTarget~Event 导致此函数运行的blur事件。
监听下列事件:
- event:blur
- 继承自:
-
- Slider#handleBlur
handleClick(event)
-
滑块上的点击事件的侦听器,用于防止点击冒泡到像按钮菜单这样的父元素。
参数:
名称 类型 描述 eventObject 导致此对象运行的事件
- 继承自:
-
- Slider#handleClick
handleFocus(event)
-
处理此滑块上的
focus事件。参数:
名称 类型 描述 eventEventTarget~Event 导致此函数运行的焦点事件。
监听下列事件:
- event:focus
- 继承自:
-
- Slider#handleFocus
handleKeyPress(event)
-
Called when this SeekBar has focus and a key gets pressed down. By default it will call
this.handleActionwhen the key is space or enter.Parameters:
Name Type Description eventEventTarget~Event The
keydownevent that caused this function to be called.Listens to Events:
- event:keydown
- Overrides:
-
- Slider#handleKeyPress
handleMouseDown(event)
-
Handle mouse down on seek bar
Parameters:
Name Type Description eventEventTarget~Event The
mousedownevent that caused this to run.Listens to Events:
- event:mousedown
- Overrides:
-
- Slider#handleMouseDown
handleMouseMove(event)
-
Handle mouse move on seek bar
Parameters:
Name Type Description eventEventTarget~Event The
mousemoveevent that caused this to run.Listens to Events:
- event:mousemove
- Overrides:
-
- Slider#handleMouseMove
handleMouseUp(event)
-
Handle mouse up on seek bar
Parameters:
Name Type Description eventEventTarget~Event The
mouseupevent that caused this to run.Listens to Events:
- event:mouseup
- Overrides:
-
- Slider#handleMouseUp
stepBack()
-
仅限键盘用户可以更快地后退
stepForward()
-
快速向前移动只适用于键盘用户
update(eventopt)
-
更新搜索栏UI。
Parameters:
Name Type Attributes Description eventEventTarget~Event <optional> The
timeupdateorendedevent that caused this to run.Listens to Events:
- Player#event:timeupdate
- Player#event:ended
- Overrides:
-
- Slider#update
vertical(boolopt) → {boolean}
-
如果滑块对于垂直方向是水平的,则获取/设置
Parameters:
Name Type Attributes Description boolboolean <optional> - true if slider is vertical,
- false is horizontal
Returns:
boolean -
- true if slider is vertical, and getting
- false if the slider is horizontal, and getting
- Inherited From:
-
- Slider#vertical
- true if slider is vertical,
Events
slideractive
-
当滑块处于活动状态时触发
Type:
- EventTarget~Event
- Inherited From:
-
- Slider#event:slideractive
sliderinactive
-
当滑块不再处于活动状态时触发。
Type:
- EventTarget~Event
- Inherited From:
-
- Slider#event:sliderinactive
videojs文档翻译-SeekBar的更多相关文章
- videojs文档翻译-api
直播流地址 rtmp://live.hkstv.hk.lxdns.com/live/hks API 接口 (一) Modules 模块 1) browser :浏览器 2) ...
- videojs文档翻译Guides-components
components Components Video.js播放器的架构围绕组件. Player类和所有表示播放器控件和其他UI元素的类都继承自Component类. 这种架构使得可以轻松地以反映DO ...
- videojs文档翻译-Player(v6.0.0-RC.2)
Player 当使用任何Video.js设置方法初始化视频时,将创建Player类的实例. 创建实例后,可以通过两种方式在全局访问: 调用videojs('example_video_1');直接通过 ...
- videojs文档翻译Guides-Plugins
Video.js Plugins Video.js的一大优势在于其插件生态系统,允许来自世界各地的作者分享他们的视频播放器定制.这包括从最简单的UI调整到新的播放技术和资源处理程序的一切! 因为我们将 ...
- videojs文档翻译-EventTarget
EventTarget new EventTarget() EventTarget是一个可以与DOM EventTarget具有相同API的类. 它增加了包含冗长功能的缩写功能. 例如:on函数是 ...
- 一款开源免费跨浏览器的视频播放器--videojs使用介绍
最近项目中的视频功能,需要做到浏览器全兼容,所以之前用html5实现的视频功能就需要进行改造了.在网上翻了个遍,试来试去,在所有的视频播放器中,就数它最实际了.首先我们来看看它的优点: 1.它是开源免 ...
- 【转】一款开源免费跨浏览器的视频播放器--videojs使用介绍
特别提示:本人博客部分有参考网络其他博客,但均是本人亲手编写过并验证通过.如发现博客有错误,请及时提出以免误导其他人,谢谢!欢迎转载,但记得标明文章出处:http://www.cnblogs.com/ ...
- 我是如何进行Spring MVC文档翻译项目的环境搭建、项目管理及自动化构建工作的
感兴趣的同学可以关注这个翻译项目 . 我的博客原文 和 我的Github 前段时间翻译的Spring MVC官方文档完成了第一稿,相关的文章和仓库可以点击以下链接.这篇文章,主要是总结一下这个翻译项目 ...
- Hibernate 3.3.2 文档翻译 Day01
Hibernate 3.3.2 文档翻译 翻译人:微冷的雨 第一次书写:2015年11月29日 本人呕心沥血之作,请细心阅读领悟! Day01-1.1 项目描述 微冷的雨翻译:例如,我们将要建立一个可 ...
随机推荐
- JAVA并行程序基础一
JAVA并行程序基础一 线程的状态 初始线程:线程的基本操作 1. 新建线程 新建线程只需要使用new关键字创建一个线程对象,并且用start() ,线程start()之后会执行run()方法 不要直 ...
- Qt实现网络聊天室(客户端,服务端)
1. 效果演示 客户端 服务器 连接成功之后 2. 预备知识 如果不知道网络编程的可以去看我的上一篇文章C++网络编程 在Qt中,实现网络编程的方式比用C++或C实现要方便简单许多,因为Qt已经替我们 ...
- css初级代码
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8& ...
- C++中指针与引用详解
在计算机存储数据时必须要知道三个基本要素:信息存储在何处?存储的值为多少?存储的值是什么类型?因此指针是表示信息在内存中存储地址的一类特殊变量,指针和其所指向的变量就像是一个硬币的两面.指针一直都是学 ...
- OSPF路由协议
一.OSPF的工作过程 二.OSPF的基本概念 三.DR与BDR 四.OSPF数据包类型 五.OSPF邻接关系的建立 六.OSPF的路由器类型 一.OSPF的工作过程 OSPF路由协议针对每一个区域分 ...
- Akamai CDN刷新(通过Akamai cli 自动刷新)
1.刷新类型选择 根据官方介绍,可使用多种途径和方式来完成快速刷新 按照简便快捷高效的要求,暂时选择Akamai cli + url 来完成刷新. 2.二进制文件下载地址 文件下载地址:https:/ ...
- 乘风破浪,遇见Visual Studio 2022预览版(Preview),宇宙最强开发者工具首次迎来64位版本
简介 众所周知,我们从官方新闻来看,对Visual Studio 2022最大的期待莫过于:其是首个64位的Visual Studio,这个宇宙最强开发者工具一脚迈入了新的阶段. https://vi ...
- AcWing 829. 模拟队列
实现一个队列,队列初始为空,支持四种操作: (1) "push x" – 向队尾插入一个数x: (2) "pop" – 从队头弹出一个数: (3) " ...
- Failed to convert property value of type 'java.lang.String' to required type 'java.util.Date'
我的情况是:在applicationContext.xml文件中配置 <bean id="member" class="com.entity.Member" ...
- 基于Flink构建全场景实时数仓
目录: 一. 实时计算初期 二. 实时数仓建设 三. Lambda架构的实时数仓 四. Kappa架构的实时数仓 五. 流批结合的实时数仓 实时计算初期 虽然实时计算在最近几年才火起来,但是在早期也有 ...