0

我正在尝试使用很棒的 video.js,它为界面使用了自定义图标字体。

但是我需要更多图标,我们已经在我们的网站上使用了 font-awesome,所以认为如果我们可以只使用这些图标会很棒,而且由于 video.js 已经使用了自定义图标字体,我认为这应该很容易.

所以,我添加了一个自定义按钮:

vjs.QuickClip = vjs.Button.extend({
    /** @constructor */
    init: function (player, options) {
        vjs.Button.call(this, player, options);
    }
});

vjs.QuickClip.prototype.buttonText = 'Quick Clip';

vjs.QuickClip.prototype.buildCSSClass = function () {
    return 'vjs-quickclip-control ' + vjs.Button.prototype.buildCSSClass.call(this);
};

vjs.QuickClip.prototype.onClick = function () {

    var offset = 10;
    var time = this.player_.currentTime();
    var clipStart = time < 10 ? 0 : time - 10;
    var clipEnd = time + offset > this.player_.duration() ? this.player_.duration() : time + offset;
    console.log('Clipped at ' + time + ' so from ' + clipStart + ' to ' + clipEnd);

};

并尝试替换vjs-quickclip-controlicon icon-crop部分有效。 在此处输入图像描述

突出显示的小按钮是输出。

所以,这显然不起作用,所以现在我想知道,我该怎么做?

我试图创建一个 JS 小提琴,但它似乎没有正确加载......

4

1 回答 1

1

啊,明白了,

对于我使用的新链接

.vjs-default-skin .vjs-control.vjs-quickclip-control:before {
    font-family: FontAwesome;
    content:"\f125";
}
于 2013-06-17T06:30:42.063 回答