视频js中的Jumpy seekbar

时间:2018-08-24 12:47:49

标签: javascript video.js

我正在尝试在我的reactjs应用程序中实现videojs。我已经在播放器中上传了5秒的视频。

问题:搜索栏无法平滑过渡

这是因为videojs在间隔中调用timeupdate方法。这就是为什么当前时间值不平滑的原因。我可以以任何方式使其平滑吗?

initVideoJS = ()=> {
        let x
        var myPlayer = videojs('video-el');

        myPlayer.on("timeupdate", () => {
            duration = myPlayer.duration();
            currentTime = myPlayer.currentTime();

            console.log(currentTime)
            this.setState({line1_xEnd: currentTime * 500/duration}, ()=>{
                console.log(this.state.line1_xEnd)
            })

        })
    }

我试图在互联网上寻找相同的东西,但是除了这个没办法

https://github.com/videojs/video.js/issues/4526

但这也很令人困惑。有人可以帮我吗?

1 个答案:

答案 0 :(得分:0)

vjs.SeekBar.prototype.onMouseMove = function(event){
var newTime = this.calculateDistance(event) * this.player_.duration();

// Don't let video end while scrubbing.
if (newTime == this.player_.duration()) { newTime = newTime - 0.1; }

// Set new time (tell player to seek to new time)
this.player_.currentTime(newTime);
}; 

这是工作版本download

please refer to this post