教育场景下禁用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>

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

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

我的热门文章汇总:

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

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

相关推荐
迅猛龙办公室18 分钟前
Python输出当前计算机的系统日期和时间
开发语言·前端·python
小狼1545434 分钟前
浏览器扩展脚本为什么有时候不生效:注入时机、iframe 和单页路由,多多开票助手
前端·chrome
じòぴé南冸じょうげん1 小时前
油猴脚本突然发现变成灰色了,无法使用?页面不生效?刷新页面没反应?
前端
Csvn2 小时前
组合式 API(Composition API)
前端
火柴就是我4 小时前
Android 打包报错 25.0.3
android·前端
BD_Marathon4 小时前
消息对象中字段的说明
java·前端·python
八荒启·交互动画4 小时前
Web特效025—用 Canvas 2D 做Web特效的定义与边界:这支画笔能做到哪一步
前端·webgl·网页特效·八荒启-交互动画·八荒启
Ai-_Man4 小时前
您您这可以把Dola的多个会话比如说。左侧的多个会话一次性导出吗?不是单条会话里面的多次会对话。用AI导出鸭,答案是可以的
开发语言·前端·人工智能·小程序
excel4 小时前
Nuxt 中使用 useHead 优化 SEO 与 GEO
前端
IT_陈寒5 小时前
SpringBoot启动慢得像蜗牛?原来是这个配置在捣鬼
前端·人工智能·后端