<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" id="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;">
<title>微视频</title>
</head>
<style>
html,body{overflow-x:hidden ;margin:0;padding:0;box-sizing: border-box;background-color:#fff;}
*{margin:0;padding:0;}
.vedio_wra{width:100%;}
.vedio_wra video{width:100%;}
</style>
<body>
<div class="vedio_wra">
<video controls id="video">
<source src="images/test.mp4" type="video/mp4">
<source src="images/test.mp4" type="video/ogg">
您的浏览器不支持Video标签。
</video>
</div>
</body>
<script src="js/jquery-1.11.3.min.js"></script>
<script>
// 禁止快进
var sym;
var video=document.querySelector("#video")
setInterval(function () {
var time=video.currentTime
if(time-sym>1){
video.currentTime=sym
}
sym=video.currentTime
},500);
</script>
</html>
没有合适的资源?快使用搜索试试~ 我知道了~
h5,video禁止拖动进度条,禁止快进
共3个文件
js:1个
mp4:1个
html:1个
需积分: 50 68 下载量 190 浏览量
2019-03-24
12:47:03
上传
评论 5
收藏 17.7MB RAR 举报
温馨提示
利用jq简单控制h5视频播放进度条,让使用者不能快进,可以后退。原理是每500毫秒记录一次进度条时间,如果下一个500毫秒的进度减去上一个500毫秒的进度大于1秒,那么就让视频返回到上一个进度,因项目开发中对于视频播放只有这么一个要求,所以搞得比较简单。代码仅作参考。大神轻喷。
资源推荐
资源详情
资源评论
收起资源包目录
video.rar (3个子文件)
video
images
test.mp4 17.92MB
js
jquery-1.11.3.min.js 94KB
video_detail.html 999B
共 3 条
- 1
资源评论
GustavoLi
- 粉丝: 10
- 资源: 3
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功