JS监听video视频播放时间
采用原生时间监听element.addEventListener(event, function, useCapture)

//监听播放时间
var video = document.getElementById(videoName);
//使用事件监听方式捕捉事件
video.addEventListener("timeupdate",function(){
var timeDisplay;
//用秒数来显示当前播放进度
timeDisplay = Math.floor(video.currentTime);
var popCut=popTime //视频弹出时间
//当视频播放到 maxpopCut的时候做处理
if(timeDisplay == popCut||timeDisplay>popCut){
video.pause() //视频暂停 play();视频播放
video.setAttribute('src',''); //去除src内容
video.style.display="none";
$('.navBar').css('z-index','')
$('.layer-box').show()
var scroTop=$(document).scrollTop() //滚动条距离顶部的位置
$('.layer-box').css('top',scroTop+'px') //弹出框顶部位置
// 当弹出层出现的时候,禁止弹出层背景层滑动,阻止事件传递冒泡
function move(e){
e.preventDefault();//禁止事件冒泡
}
$('.layer-box').on('touchmove',move, false)//弹出层出现,弹出层的背景层阻止默认滑动事件
$('.share-btn').click(function(){
console.log('跳转 ')
window.location.href="${path}/share/toShare?id="+webPageId
//window.open("${path}/share/toShare?id="+webPageId)
//$('.navBar').css('z-index','99')
})
}
},false)
JS监听video视频播放时间的更多相关文章
- js监听输入框值的即时变化onpropertychange、oninput
js监听输入框值的即时变化onpropertychange.oninput 很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感. // // 要达到的效果 ...
- js 监听整个页面的回车事件
JS监听整个页面的回车事件 <script type="text/javascript"> document.onkeydown=keyDownSearch; ...
- 原 JS监听回车事件
原 JS监听回车事件 发表于2年前(2014-06-04 10:16) 阅读(6101) | 评论(0) 11人收藏此文章, 我要收藏 赞0 1月16日厦门 OSC 源创会火热报名中,奖品多多哦 ...
- js监听用户的键盘敲击事件,兼容各大主流浏览器
js监听用户的键盘敲击事件,兼容各大主流浏览器 <script type="text/javascript"> document.onkeydown = functio ...
- JS监听组合按键
有些时候,我们需要在网页上,增加一些快捷按键,方便用户使用一些常用的操作,比如:保存,撤销,复制.粘贴等等. 下面简单梳理一下思路: 我们所熟悉的按键有这么集中类型: 单独的按键操作,如:delete ...
- js监听input等表单输入框的变化事件oninput
js监听input等表单输入框的变化事件oninput,手机页面开发中使用到文本框textarea输入字符监听文本框变化计算还可以输入多少字符,如果使用onkeyup的话是无法监听到输入法输入的文本变 ...
- 使用web3.js监听以太坊智能合约event
传送门: 柏链项目学院 使用web3.js监听以太坊智能合约event 当我们在前端页面调用合约时发现有些数据不会立即返回,这时还需要再调用更新数据的函数.那么这样的方法使用起来非常不便,监听ev ...
- 知识点---js监听手机返回键,回到指定界面
方法一. $(function(){ pushHistory(); window.addEventListener(“popstate”, function(e) { window.location ...
- js监听页面放大缩小
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>d ...
随机推荐
- 案例:WLC HA主WLC进入维护模式
案例场景: 如图所示,7609-1和7609-2分别是网络中的核心设备,起了HSRP,7609-1连接的是WLC-1,,7609-2连接的是WLC-2,WLC1和WLC2的RP口相互连接. WLC的管 ...
- Vue项目引进ElementUI组件
1.https://blog.csdn.net/Mr_JavaScript/article/details/80741914 1.1 安装 npm install element-ui -save 1 ...
- 加载Properties配置文件
/** * 加载Properties配置文件 * * @author ZhangHaiNing * @param file 要读取的文件 * @return */ public static Prop ...
- Http 状态码总结
HTTP 状态码列表 一. 1 开头 (继续执行) 服务器收到请求,需要请求者继续执行操作 100:(continue) 客户端继续请求 101:(Switching Protocols) 切换协议, ...
- springboot 打包成jar
1.pom.xml配置 <build> <plugins> <plugin> <groupId>org.apache.maven.plugins< ...
- 基于通用二进制方式安装MySQL-5.7.24(比源码安装MySQL快许多)及破密码
确保系统中有依赖的libaio软件 yum -y install libaio 使用wget命令下载mysql-5.7.24软件包 wget http://mirrors.sohu.com/mysql ...
- PXE无人值守实现批量化自动安装Linux系统
设想一个场景:假如让你给1000台服务器装系统,你会怎么做?跑去每一台服务器给它安装系统吗?显然不会.. 一.概括 通过网络引导系统的做法可以不必从硬盘.软盘或CD-ROM硬盘,而是完全通过网络来引导 ...
- tomcat配置限制ip和建立图片服务器
1.配置限制ip访问 打开 tomcat里conf文件下的server.xml 在<Host name="localhost" appBase="webapps&q ...
- jenkins windows 2.204版,免安装,推荐插件齐备.
windows专用,已安装好推荐插件, 更新了安装源为清华源,也就是说只要官方的插件,你都可以秒速下载了.香不? 解压到一个文件夹,管理员模式运行cmdcd 文件夹名jenkins install这样 ...
- mac 终端连接服务器报错
今天在连接虚拟机服务器时突然报了一个 WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!的错误.  会出现这个错误的原因是在第一次进行SSH连接时,会生 ...