video.js 禁用单击暂停

最新推荐文章于 2024-02-27 15:21:04 发布

weixin_34060741

最新推荐文章于 2024-02-27 15:21:04 发布

阅读量6.5k

点赞数 3

文章标签： javascript ViewUI

原文链接：https://segmentfault.com/a/1190000018418432

版权

video.js 默认效果是单击播放区域暂停

需求：要实现单击播放区禁止暂停功能

google发现有人提过这样的issue
作者给出来答案，通过一段css来屏蔽

.vjs-tech {
  pointer-events: none;
}

亲测有效

本来想着通过找到触发pause事件的方法进行处理的，没想到通过css就可以搞定

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_34060741

关注关注

3
点赞
踩
5

收藏

觉得还不错? 一键收藏
2
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

HTML5新增标签Video

X_dam的博客

01-14

772

H5新增了很多语义化标签，其中video标签就是，它取代了flash的视频效果，拥有了更多新功能 video标签视频的地址用src引入，支持MP4、ovg、webm格式，是行内块元素。属性 autoplay:自动播放，在浏览器中会被禁用，需要去浏览器设置，但是在静音状态下可以自动播放 muted : 设置静音 controls : 标签自带的控件，就是视频进度条那一栏，不同浏览...

JavaScript基础学习笔记

qq_42436532的博客

04-10

907

JS基础 1.运算符 1.1 自增运算符 var e = 10; var f = e++ + ++e; // 1. e++ = 10 e = 11 // 2. e = 12 ++e = 12 console.log(f); // 22 1.2 逻辑运算符 1.2.1 逻辑与有假必假，两边都是true才返回true 对于数值和表达式：语法：表达式1 && 表达式2 如果第一个表达式的值为真，则返回表达式2 如果第一个表达式的值为假，则返回表达式1 conso

2 条评论您还未登录，请先登录后发表或查看评论

video标签常用控制配置，禁用单击暂停，保留双击全屏

mullerpp的博客

07-15

2913

【代码】video标签常用控制配置，禁用单击暂停，保留双击全屏。

video.js 禁用播放区单击暂停

qq_42249552的博客

12-05

2688

.vjs-tech { pointer-events: none; } 直接加以上css pointer-eventsCSS 属性指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的 target none 元素永远不会成为鼠标事件的target。但是，当其后代元素的pointer-events属性指定其他值时，鼠标事件可以指向后代元素，在这种情况下，鼠标事件将在捕获...

video 禁用单击暂停

辉生活-记录程序生活的点滴。

09-03

2540

添加样式pointer-events: none;即可，如下： .video { pointer-events: none; }

h5 video 样式去掉工具条点击播放暂停

qq_40599116的博客

09-19

3861

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <button onclick="play()&quo

html5video暂停标志取消6,【Web前端问题】video标签如何实现点击播放再点击暂停（多个VIDEO）...

weixin_32451529的博客

06-19

997

我这么写如果多的话太麻烦了回答：var vids = document.getElementsByTagName('video');for (var i = 0; i < vids.length; i++) {vids[i].onclick = function(){if(this.paused){this.play();}else{this.pause();}}}回答：如果你的vide...

阻止视频video标签点击视频区域播放暂停

u014788505的博客

05-11

2161

myVid = document.getElementById("video1"); myVid.addEventListener("click", mouseHandler, false); function mouseHandler(event) { // 阻止视频默认点击事件 event.preventDefault() }

HTML5、CSS、JS基础

qq_49101841的博客

03-03

2262

学习笔记

tools.txt

huhuoyun的专栏

02-15

935

-----------------update 2017.08.20---------------- add-tools: apt-get install eclipse-cdt-autotools apt-get install convmv fuse-convmvfs unar apt-get install blender-dbg blender-ogrexml-1.8 apt-get install libgtkmm-3.0-dbg systemtap-sdt-de.

前端笔记(Html+CSS+JS+DOM+网页特效+jQuery+HTML5+CSS3+canvas 标签+web开发重难点+面向对象+AJAX)

热门推荐

qq_36609655的博客

07-02

1万+

第1章Html Html：超级文本标记语言（HyperText Markup Language），在浏览器上运行的一种标记语言。就是给文本加上含有语义的标签。接下来应该学习更多具体语义标签：一、结构（固定的结构） <html> <head> <title></title> </head> <bod...

使用JS阻止按钮后台Click事件

杨斐的专栏

05-09

4244

function exam() { if (document.getElementById('TextBox1').value == "") { $('#span').append('不能为空的！'); return false; } }

(3)网页视频获取下载案例3

love_c_s的博客

06-23

4131

在这之前已经试了两次，这次还要下载一个视频。 1.原网页：https://e.huawei.com/cn/videolist/local/807f6de08c9a471f83f28dc0d4b0bcbd ctrl+shift+c打开调试，右边选中视频对应的区域的代码。（一般是又MP4字样的） 2.复制下来 <div class="vedioplay pause" data-wapnodialog="true" data-content=".video" data-video-path..

vue-video-player 播放加截图踩坑的解决方法随笔

qq_42265650的博客

05-20

509

this.$nextTick(() => { let video = document.getElementsByClassName("vjs-tech")[0]; let canvas = document.createElement("canvas"); let img = new Image(); // img.crossOrigin = "anonymous"; //原先以为是这个问题跨域 let w = wind

vue-video-player 手机端使用postcss-pxtorem自适应大小

w710537643的博客

06-16

1273

<template> <div class='videomp4' @dblclick="clickFun()"> <video-player class="video-player vjs-custom-skin" ref="videoPlayer" :playsinline="true" :options="playerOptions"

Web端集成海康视频监控画面

最新发布

何以问_的博客

02-27

1794

Web端集成海康视频监控画面

前端对接海康威视监控

weixin_39559449的博客

07-01

3658

参考文章 vue对接官方插件WebControl：https://blog.csdn.net/qq_41732963/article/details/115670910vue无海康官方插件对接：https://blog.csdn.net/qq_41732963/article/details/115655739海康监控流有多种协议实时串流协议（Real Time Streaming Protocol，RTSP）是一种网络应用协议，专为娱乐和通信系统的使用，以控制流媒体服务器。该协议用于建立和控制终

视频的多种方式

qq_55002615的博客

02-20

303

关于页面视频显示的多种播放形式

html5 video 停止播放视频,html5 video怎么停止播放视频

weixin_39932344的博客

06-16

4166

html5 video停止播放视频的方法：首先使用“document.getElementById("id值")”获取到video对象；然后使用“video对象.pause()”语句停止(暂停)当前播放的视频即可。本教程操作环境：windows7系统、HTML5&&javascript1.8.5版、Dell G3电脑。html5 video停止播放视频播放/暂停您的浏览器不支持 H...

video.js取消暂停按钮

08-16

根据引用中的代码示例，要实现video.js取消暂停按钮，可以通过修改属性的方式来实现。在代码中，可以看到有一个名为`videoPauseShow`的属性，当该属性为`true`时，执行视频暂停操作；当该属性为`false`时，执行视频...