求助禁止拖动视频的进度条？

我在html5中有一个视频，需求是禁止向前拖动进度条，但是可以向后。。这个应该如何做？

<video src="xx,mp4" autoplay="autoplay" controls="controls"width="720" height="480"></video>

<script type="text/javascript">
var tarr = [];
var video = document.querySelector("video");
video.addEventListener("timeupdate", function (e) {
    console.log("timeupdate",video.currentTime);
    tarr.unshift(video.currentTime);
    tarr.length = 2;
}, false);
video.addEventListener("seeking", function (e) {
    console.log("seeking",video.currentTime);
    if (video.currentTime<tarr[1]) {//不知道你说的向前和向后是指什么方向，方向不对的话把 < 改成 >
        video.currentTime = tarr[1];
    }
}, false);
</script>

参考这篇文章https://segmentfault.com/q/1010000007929315

1、不自定义进度条的话就只能用默认进度条，默认的进度条是集合在video标签中的，这个我们无法实现不能拖动，但是可以模拟下，你可以使用让鼠标点击到视
频所在的video或者div的时候无效化，原理就是鼠标选不到进度条，自然不能拖动了。如果你是要可以控制播放和暂停的话就实现js控制，反正是跳过
video自带的控制器自己去写。
2、用个透明的层或图片把进度条盖住

不写controls属性，并用div自定义一个只能向后拖动的进度条

前端时间做项目碰到了这个需求。用的是video.js 插件

还有个解决思路就是给控制条定位一个遮罩层防止点击~