采用原生时间监听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. 工具 - SDK安装

    Why 在deepin linux上安装Java很头疼.. How 于是有了sdk man! https://sdkman.io/ sdk list java sdk install java < ...

  2. python应用-pycharm新建模板默认添加shebang编码作者时间等信息

    1.pycharm4.5激活码 用户名: yueting3527 注册码: ===== LICENSE BEGIN ===== 93347-12042010 00001FMHemWIs"6w ...

  3. WORKDIR 指定工作目录 每一个 RUN 都是启动一个容器、执行命令、然后提交存储层文件变更

    WORKDIR 指定工作目录 格式为 WORKDIR <工作目录路径>. 使用 WORKDIR 指令可以来指定工作目录(或者称为当前目录),以后各层的当前目录就被改为指定的目录,如该目录不 ...

  4. Hibernate学习(五)

    自关联测试案例 1.创建表 drop table if exists t_category ; create table t_category ( id ) primary key , name ) ...

  5. MYSQL---外键 primary key 作用

    https://www.cnblogs.com/x739400043/p/4732158.html 外键和级联   关于外键写的不错的网址:http://blog.csdn.net/lidaasky/ ...

  6. [todo0211]c语言指针,结构体的疑问

    #include <stdio.h> #include <mm_malloc.h> struct ListNode { int val; struct ListNode *ne ...

  7. kudu-master服务启动失败

    执行service kudu-master start ,  提示启动失败failed. 进入报错日志目录  (cd /var/log/kudu/),看到报错信息(vim kudu-master.ER ...

  8. JS清除空格之trim()方法

    JQ: $.trim() 函数用于去除字符串两端的空白字符. 注意:$.trim()函数会移除字符串开始和末尾处的所有换行符,空格(包括连续的空格)和制表符.如果这些空白字符在字符串中间时,它们将被保 ...

  9. 基于Goolgle最新NavigationDrawer实现全屏水平平移

    常见实现App 上面侧边栏菜单之前使用SlidingMenu,现在发现Goolgle原生NavigationDrawer也挺好用.但是细心的开发者们发现NavigationDrawer没有类似Slid ...

  10. 苹果应用商店AppStore审核规则指南

    http://www.zesmob.com/blog/40161.html 新应用上架苹果AppStore或重大版本更新时,往往会被拒多次,造成审核不通过的原因,主要是因为对苹果应用商店AppStor ...