当前位置: 首页 > news >正文

教育场景下禁用html5播放器拖动进度条的例子

禁用视频课程进度条的拖动功能,主要是为了强制学员按照课程设计的顺序观看内容,防止跳过关键知识点,从而保证学习效果和课程的完整性。 

1.防止应试作弊:
在一些需要观看视频才能解锁下一章节或完成测试的场景中,禁用拖动能确保学员真正观看了教学内容,而不是仅仅为了完成任务而快进。


2.强制观看基础知识:
对于那些知识点层层递进的课程(例如编程、数学等),禁用拖动能确保学员从最基础的概念开始学习,避免跳过前提知识导致后续学习困难。

代码例子:完全禁止拖动视频播放器进度条。

<div id="player"></div>
<script src="//player.polyv.net/resp/vod-player/latest/player.js"></script>
<script>var player = polyvPlayer({wrap: '#player',width: 800,height: 533,ban_seek:'on', //禁止拖动视频进度条(on,off)//ban_seek_by_limit_time:'on', //是否禁止视频拖拽未播放区域(on,off)vid: '88083abbf5bcf1356e05d39666be527a_8', playsafe:'81814fed-bdd0-4506-bec1-ebc8093148c5-hfevwsfxcsbcocx', //playsafeUrl:'https://myDomain.com/token', ts:'1568131545000',sign:'88313661ba7ded642c7b557b0a364b4b'});
</script>

代码例子:禁止拖动视频播放器"未播放区域"的进度条(已播放过区域的进度条可以拖动)。

<div id="player"></div>
<script src="//player.polyv.net/resp/vod-player/latest/player.js"></script>
<script>var player = polyvPlayer({wrap: '#player',width: 800,height: 533,//ban_seek:'on', //禁止拖动视频进度条(on,off)ban_seek_by_limit_time:'on', //是否禁止视频拖拽未播放区域(on,off)vid: '88083abbf5bcf1356e05d39666be527a_8', playsafe:'81814fed-bdd0-4506-bec1-ebc8093148c5-hfevwsfxcsbcocx', //playsafeUrl:'https://myDomain.com/token', ts:'1568131545000',sign:'88313661ba7ded642c7b557b0a364b4b'});
</script>

以下为禁止拖动视频播放器进度条的截图:

禁用拖动视频进度条

禁用拖动视频进度条的效果(播放器会显示进度条,但进度条被禁用,因此无法拖动和操作)

 我的热门文章汇总:

  • 开通微信视频号直播需要满足哪些条件?
  • 彻底永久关闭WIN10系统的自动更新(操作步骤)
  • 视频码率、帧率、分辨率、视频标清、高清、全高清的全面介绍与参考表
  • Thinkpad电脑系列产品进入Bios设置和U盘启动(重装系统)
  • 网线水晶头接法图解详细8根线芯顺序排序图示

我的在线教育原创文章汇总:

  • Vue3框架对接保利威云点播播放器的实践(实例)
  • 视频点播web端AI智能大纲(自动生成视频内容大纲)的代码与演示
  • html5视频播放器的断点续播和记忆播放是如何做的?
  • 视频安全之视频防盗链和视频防盗录
  • 课程学习网站视频禁止拖拽快进是如何做的?
  • 数字化动态ID做随机水印实现视频防录屏的效果
  • 在线教育视频中实用的视频问答互动(应用实例)
  • 教培机构在线视频播放器的视频问答功能(视频弹题、问答播放)的实现
  • 视频加密:教育机构视频培训内容如何做视频加密?

我的谷歌浏览器相关文章汇总:

  • 如何在Google Chrome浏览器中禁用密码联想与保存功能
  • 谷歌google网页索引编制报告的介绍
  • 谷歌Google抓取视频使用受支持的视频文件类型
  • Chrome 浏览器调试日志查询
  • 前端实现页面自动播放音频方法
http://www.dtcms.com/a/343232.html

相关文章:

  • python 项目编号 2025821 有关于中英文数据的收集、处理
  • mac的m3芯片通过Homebrew安装git
  • ES_分词
  • 2025-08-21 Python进阶9——__main__与lambda
  • Harbor私有仓库实战配置
  • FLUX-Text模型完全配置指南:从环境搭建到故障排除
  • 用例完备性1:用例模板
  • 数据结构-HashMap
  • Kubernetes“城市规划”指南:告别资源拥堵与预算超支,打造高效云原生都市
  • Typora 快速使用入门:15分钟掌握高效写作
  • 锅炉铸造件三维扫描尺寸及形位公差检测技术方案-中科米堆CASAIM
  • ⸢ 啟 ⸥ ⤳ 为什么要开这个专栏?
  • Ubuntu Server 系统安装 Docker
  • uni-app:实现文本框的自动换行
  • SpringBoot + Vue实现批量导入导出功能的标准方案
  • k8sday13数据存储(1.5/2)
  • 基于Matlab多技术融合的红外图像增强方法研究
  • C++---滑动窗口平滑数据
  • 瑞派亚宠展专访 | 以数智化重塑就医体验,共筑宠物健康新生态
  • 区块链存证操作
  • echarts关系图(Vue3)节点背景图连线设置
  • 2025.7.19卡码刷题-回溯算法-组合
  • IOS购买订阅通知信息解析说明Java
  • 设计模式3-模板方法模式
  • 爬虫基础学习-项目实践:每次请求,跟换不同的user-agent
  • 茶饮业内卷破局,从人力管理入手
  • iOS 手势与控件事件冲突解决清单
  • 一本通1342:【例4-1】最短路径问题
  • 【Docker基础】Docker-Compose核心配置文件深度解析:从YAML语法到高级配置
  • 一个状态机如何启动/停止另一个状态机