Question

VideoJS帮助重定向到这里，所以我想删除一个错误报告：当你拖动视频条加载指示器上的视频导引头指示符出现时，永远不会消失。视频是否在该地方加载并不重要 - 它也无法点击，所以...隐藏它是很有意义的。

除此之外：一个很棒的插件:)就像YouTube或Vimeo玩家一样 - 保持伟大的工作！

Answer 1

错误/功能请求可以在https://github.com/videojs/video.js/issues?state=open

提交

这也是我最初的错误。我最终只是在搜索期间关闭了加载微调器，但是修改loadingSpinner并不难以做你想要的。

以下示例假设您使用的是最新的4.1 api。

/**
 * An event listener meant to be fired for timeupdate events. If the event
 * contained the updated time, we wouldn't need to ask the player, but alas.
 */
videojs.LoadingSpinner.prototype.showIfNotBuffered = function() {
  var time = this.player_.currentTime();
  var timeRanges = this.player().buffered();
  for (var i = 0; i < timeRanges.length; i++) {
    if (time >= timeRanges.start(i) && time <= timeRanges.end(i)) {
      this.hide();
      return;
    }
  }
  this.show();
};

/**
 * Adds a listener for timeupdate events, and modifies state tracking whether
 * we're currently listening to timeupdate events.
 */
videojs.LoadingSpinner.prototype.startTimeUpdateListener = function() {
  if (this.timeUpdatesOn) return;
  this.timeUpdatesOn = true;
  this.player_.on(
    'timeupdate', 
    vjs.bind(this, videojs.LoadingSpinner.prototype.showIfNotBuffered));
};

/**
 * Does the opposite of the above function. Combine?
 */
videojs.LoadingSpinner.prototype.stopTimeUpdateListener = function() {
  if (!this.timeUpdatesOn) return;
  this.player_.off(
    'timeupdate', videojs.LoadingSpinner.prototype.showIfNotBuffered);
  this.timeUpdatesOn = false;
};


/* Video initialization */
var vid = videojs("video", {});

/* First, turn off automatically showing the spinner when seeking. */
vid.player().off('seeking', videojs.LoadingSpinner.prototype.show);

/* Start listening to timeupdates once seeking starts; */
vid.player().on('seeking', vjs.bind(vid.loadingSpinner, videojs.LoadingSpinner.prototype.startTimeUpdateListener));

/* Stop listening to timeupdates once seeking ends. */
vid.player().on('seeked', vjs.bind(vid.loadingSpinner, videojs.LoadingSpinner.prototype.stopTimeUpdateListener));

更新：上面的示例假设您正在使用未缩小的dev.js.我是video.js的新手，并没有意识到dev和prod版本之间的API存在很大差异。以上是重新设计的内容，您可以使用prod / minified版本：

var showIfNotBuffered = function() {
  var time = vid.currentTime();
  var timeRanges = vid.buffered();
  for (var i = 0; i < timeRanges.length; i++) {
    if (time >= timeRanges.start(i) && time <= timeRanges.end(i)) {
      vid.loadingSpinner.hide();
      return;
    }
  }
  vid.loadingSpinner.show();
};

/* Video initialization */
var vid = videojs("video", {}, function() {

  this.off('seeking', this.loadingSpinner.show);

  this.loadingSpinner.startTimeUpdateListener = function() {
    if (this.timeUpdatesOn) return;
    this.on('timeupdate', showIfNotBuffered);
    this.timeUpdatesOn = true;
  };

  this.loadingSpinner.stopTimeUpdateListener = function() {
    if (!this.timeUpdatesOn) return;
    this.off('timeupdate', showIfNotBuffered);
    this.timeUpdatesOn = false;
  };

  this.on('seeking', this.loadingSpinner.startTimeUpdateListener);
  this.on('seeked', this.loadingSpinner.stopTimeUpdateListener);
});

VideoJS加载指示灯不会消失

1 个答案: