Video/Audio禁止快进(退)
首先接着上个随笔。上个随笔主要介绍了视频音频的相关操作、属性和方法。这里主要记录一个应用:禁止快进(快退同理)。
思路:监听快进事件(此处是监听播放时间更新),利用一个缓存的时间和播放到的时间进行对比,如果时间大于1秒(保险起见使用2秒,以避免在播放的时刻正好在计时的那一刻的尴尬),则表明是快播,给其重置回播放时间即可。
代码:
<video
id="kingdom-video"
:src="xxx"
preload
controls
v-if="type==='video'">
</video> onTimeUpdate() {
// 学习中
if (this.playObj.effectiveDuration < this.playObj.totalDuration) {
// 禁止快进
if (this.videoAss.currentTime - this.lastTimeString > 2) {
this.videoAss.currentTime = this.lastTimeString
} else {
this.lastTimeString = this.videoAss.currentTime
}
}
}
this.videoAss = document.getElementById('kingdom-video')
this.videoAss.addEventListener('timeupdate', () => { this.onTimeUpdate() })
Video/Audio禁止快进(退)的更多相关文章
- 关于jwplayer 处理进度条禁止快进的处理方法。
今天在处理一个关于jwplayer 第一次播放禁止快进,但是可以后退的一个需求.开始在网上去查一些方法,有几个方法是换皮肤,禁止点击,但是和我的初衷不是很一致,还有一种方式是官网查看了API接口的方 ...
- JS控制Video播放器(快进、后退、播放、暂停、音量大小)
思路: 一.首先监听触发事件. 比如:向上键对应的keyCode为38,向下键对应的keyCode为40,向左键对应的keyCode为37,向右键对应的keyCode为39,空格键对应的keyCode ...
- html5 vedio 播放器,禁掉进度条快进快退事件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- video字幕无法显示,video视频在google中无法控制快进
video字幕(track)无法显示: 直接用关闭同源策略的浏览器打开你的HTML文件可以请求到字幕文件并显示字幕: 从hbuilder中打开html文件,在从里面打开google浏览器去浏览HTML ...
- Eclipse之向前快进,向后快退
在已经写好的代码上进行修改,存在代码快需要向前快进,向后快退的情况. 选中代码块,然后右击,有Shift Right, Shift Left
- jwplayer 禁止视频的快进,但是可以后退(已实现)
一直在研究.net 的视频播放,最近做起了jwplayer,然后项目要求是视频不能快进,但是可以重复观看已经看过的视频资源. 很简单 在标签<script> 中定义两个变量 var max ...
- 修改CKplayer.js 源码解决移动端浏览器全屏不能限制快进的问题
原文地址:https://www.cnblogs.com/jying/p/9642445.html,转载请说明出处. 最近项目需要播放视频且限制未观看部分的快进功能,找了两款js插件ckplayer和 ...
- android开发之GestureDetector手势识别(调节音量、亮度、快进和后退)
写UI布局: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:andro ...
- MediaElement视频控制:播放、暂停、停止、后退、快进、跳转、音量
/* ================================================= * Author: Micro * Date: 2016=03-25 ...
随机推荐
- AtomicInteger类的使用
AtomicInteger介绍 AtomicInteger是一个提供原子操作的Integer类,通过线程安全的方式操作加减. AtomicInteger使用场景 AtomicInteger提供原子操作 ...
- 并发容器之CopyOnWriteArraySet
CopyOnWriteArraySet是基于CopyOnWriteArrayList实现的,其唯一的不同是在add时调用的是CopyOnWriteArrayList的addIfAbsent方法. 具体 ...
- sql中count(*)、count(col)、count(1)区别
count(*)和count(列)根本就是不等价的,count(*)是针对于全表的,而count(列)是针对于某一列的,如果此列值为空的话,count(列)是不会统计这一行的. 也就是说count(列 ...
- 关于mui 中popover与下拉刷新冲突问题
最近用mui做app混合式开发时,作为一个后端开发,高前端确实有点吃了,期间遇到的问题肯定也不少.这两天app做更新,为了装逼,将更新的提示搞得好看些,用到了mui中的popover,结果把自己整死了 ...
- Xor Sum 01字典树 hdu4825
Xor Sum Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 132768/132768 K (Java/Others)Total S ...
- Android的JDK、SDK、Eclipse的理解
今天看了这方面的内容,感觉学到了一些东西: 首先,jdk是用来处理Java语言的, sdk是用来处理Java语言和硬件之间的关联的, eclipse是用来编写Java语言的, 通过对这方面的理解,加深 ...
- mfc动态演示排序算法
实现的排序算法 冒泡排序.选择排序.快速排序 具体实现 选用mfc中的单文档框架 ①SetTimer函数的用法. ②使用画笔画直线. ③使用FillSolidRect()函数覆盖某一矩形区域内的内容: ...
- 解决Apache Web Server的几个错误
一.安装好Apache后服务里没有Apache服务 在命令行进入安装apache的bin目录下,输入命令 httpd.exe -k install -n Apache2.4 二.Apache web ...
- Centos7下安装PHP5.5,5.6,7.0----(转载记录一下)
由于centOS7 默认的php版本是5.4的,偏低,所以收录了一下怎样安装5.5/5.6/7.0版本 默认的版本太低了,手动安装有一些麻烦,想采用Yum安装的可以使用下面的方案: 1.检查当前安装的 ...
- jenkins+ant+jmeter测试环境部署
1.安装java 2.安装jenkins 3.下载apache-jmeter-4.0,解压后放在 /home/用户名/ 下 4.下载apache-ant-1.10.3,解压后放在 /home/用户名/ ...