video.js 只能后退不能快进

video.js 只能后退不能快进

项目需要做一个视频教学 要求只能后退不能快进 找了很久才找到方法

话不多说 直接 上代码。



js代码

//用户可观看的最大值
var watchMaxTime = 0;
// 视频播放
var player = videojs('my-video',{
		//预加载
        preload : "auto",
        // 自动播放 默认值false
        //autoplay : false,
        //控制栏
        controls : true
	},function onPlayerReady(){

		//这里绑定事件
		var myPlayer = this;
		//绑定 播放时间改变事件
		myPlayer .on('timeupdate', function () {
			// 此处正常播放时  获取的视频进度
			var time = myPlayer.currentTime();
            if (time > watchMaxTime) {
                watchMaxTime = time;
            }
		});
		
	}	
});

//只能快进不能后退
    videojs.use('*', function(player){
        return {
        	// time 应该为 点击或拖动视频的值
            setCurrentTime: function(time) {
                //快进  值比最大观看点的大  则跳转至最大观看点
                if (time > watchMaxTime) {
                    return watchMaxTime;
                } else {
                    //值比最大观看点的小 则允许跳转
                    return time;
                }
            }
        };
    });

html代码

	<div >
            <video id="my-video" class="video-js vjs-big-play-centered vjs-remaining-time "
                   style="width: 100%;height: 100%" autoDisable="true" poster="" >
                   	<!-- 设置自己视频的路径 -->
					<source src="testVideo/test.mp4" type="video/mp4">
            </video>
        </div>

这样就ok了, 具体是通过下面的连接 找到的方法。

转载链接

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 7
    评论
评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值