采用原生时间监听element.addEventListener(eventfunctionuseCapture)

           //监听播放时间
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视频播放时间的更多相关文章

  1. js监听输入框值的即时变化onpropertychange、oninput

    js监听输入框值的即时变化onpropertychange.oninput 很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感. // //   要达到的效果 ...

  2. js 监听整个页面的回车事件

    JS监听整个页面的回车事件 <script type="text/javascript"> document.onkeydown=keyDownSearch;      ...

  3. 原 JS监听回车事件

    原 JS监听回车事件 发表于2年前(2014-06-04 10:16)   阅读(6101) | 评论(0) 11人收藏此文章, 我要收藏 赞0 1月16日厦门 OSC 源创会火热报名中,奖品多多哦  ...

  4. js监听用户的键盘敲击事件,兼容各大主流浏览器

    js监听用户的键盘敲击事件,兼容各大主流浏览器 <script type="text/javascript"> document.onkeydown = functio ...

  5. JS监听组合按键

    有些时候,我们需要在网页上,增加一些快捷按键,方便用户使用一些常用的操作,比如:保存,撤销,复制.粘贴等等. 下面简单梳理一下思路: 我们所熟悉的按键有这么集中类型: 单独的按键操作,如:delete ...

  6. js监听input等表单输入框的变化事件oninput

    js监听input等表单输入框的变化事件oninput,手机页面开发中使用到文本框textarea输入字符监听文本框变化计算还可以输入多少字符,如果使用onkeyup的话是无法监听到输入法输入的文本变 ...

  7. 使用web3.js监听以太坊智能合约event

    传送门: 柏链项目学院 使用web3.js监听以太坊智能合约event   当我们在前端页面调用合约时发现有些数据不会立即返回,这时还需要再调用更新数据的函数.那么这样的方法使用起来非常不便,监听ev ...

  8. 知识点---js监听手机返回键,回到指定界面

    方法一. $(function(){ pushHistory(); window.addEventListener(“popstate”, function(e) { window.location ...

  9. js监听页面放大缩小

    <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>d ...

随机推荐

  1. 案例:WLC HA主WLC进入维护模式

    案例场景: 如图所示,7609-1和7609-2分别是网络中的核心设备,起了HSRP,7609-1连接的是WLC-1,,7609-2连接的是WLC-2,WLC1和WLC2的RP口相互连接. WLC的管 ...

  2. Vue项目引进ElementUI组件

    1.https://blog.csdn.net/Mr_JavaScript/article/details/80741914 1.1 安装 npm install element-ui -save 1 ...

  3. 加载Properties配置文件

    /** * 加载Properties配置文件 * * @author ZhangHaiNing * @param file 要读取的文件 * @return */ public static Prop ...

  4. Http 状态码总结

    HTTP 状态码列表 一. 1 开头 (继续执行) 服务器收到请求,需要请求者继续执行操作 100:(continue) 客户端继续请求 101:(Switching Protocols) 切换协议, ...

  5. springboot 打包成jar

    1.pom.xml配置 <build> <plugins> <plugin> <groupId>org.apache.maven.plugins< ...

  6. 基于通用二进制方式安装MySQL-5.7.24(比源码安装MySQL快许多)及破密码

    确保系统中有依赖的libaio软件 yum -y install libaio 使用wget命令下载mysql-5.7.24软件包 wget http://mirrors.sohu.com/mysql ...

  7. PXE无人值守实现批量化自动安装Linux系统

    设想一个场景:假如让你给1000台服务器装系统,你会怎么做?跑去每一台服务器给它安装系统吗?显然不会.. 一.概括 通过网络引导系统的做法可以不必从硬盘.软盘或CD-ROM硬盘,而是完全通过网络来引导 ...

  8. tomcat配置限制ip和建立图片服务器

    1.配置限制ip访问 打开 tomcat里conf文件下的server.xml 在<Host name="localhost" appBase="webapps&q ...

  9. jenkins windows 2.204版,免安装,推荐插件齐备.

    windows专用,已安装好推荐插件, 更新了安装源为清华源,也就是说只要官方的插件,你都可以秒速下载了.香不? 解压到一个文件夹,管理员模式运行cmdcd 文件夹名jenkins install这样 ...

  10. mac 终端连接服务器报错

    今天在连接虚拟机服务器时突然报了一个 WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!的错误.  会出现这个错误的原因是在第一次进行SSH连接时,会生 ...