采用原生时间监听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. BeautifulReport底层框架的解析以及html报告页面元素的更改

    利用BeautifulReport 模块生成html报告 import BeautifulReport as br#引入包,之后设置一下别名 br = br.BeautifulReport(test_ ...

  2. Educational Codeforces Round 80 C. Two Arrays(组合数快速取模)

    You are given two integers nn and mm . Calculate the number of pairs of arrays (a,b)(a,b) such that: ...

  3. java 第三次课后作业

    1.java字段初始化的规律 public class gouzao { public static void main(String[] args) { test te=new test(); Sy ...

  4. 洛谷 P1082 同余方程(同余&&exgcd)

    嗯... 题目链接:https://www.luogu.org/problem/P1082 这道题很明显涉及到了同余和exgcd的问题,下面推导一下: 首先证明有解情况: ax + by = m有解的 ...

  5. 误删/boot下文件或目录的修复方式!

    步骤:进入硬盘的急救模式,进入磁盘,挂载光盘到/media上,rpm安装内核到media目录下,从装grub程序到/dev/sda,然后将grub文件从定向到/boot下,然后重启. 第一步:进入bi ...

  6. centos解决bash: telnet: command not found...&& telnet: connect to address 127.0.0.1: Connection refused拒绝连接

    检查telnet是否已安装: [root@hostuser src]# rpm -q telnet-serverpackage telnet-server is not installed[root@ ...

  7. PHP的自定义模板引擎

    前面的话 在大多数的项目组中,开发一个Web程序都会出现这样的流程:计划文档提交之后,前端工程师制作了网站的外观模型,然后把它交给后端工程师,它们使用后端代码实现程序逻辑,同时使用外观模型做成基本架构 ...

  8. JS实现对对象的深拷贝

    手动遍历对象拷贝 /** * 深拷贝 * @param {*} obj 拷贝对象(object or array) * @param {*} cache 缓存数组 */ function deepCo ...

  9. vue学习笔记:数据渲染操作

    {{xxx}} 基本的插值表达式 插值表达式 使用两个大括号 {{ data中定义的数据名 }} 可以将数据插入到指定的位置 这种写法不仅可以显示data属性里定义的值,也可以书写js中的表达式,可以 ...

  10. 5-create-react-app整合antDesign功能

    使用ant-design: 首先创建react项目: create-react-app app cd app 其次 AntDesign的高级配置:按需导入组件,自定义主题 1.下载依赖(利用yarn, ...