全局属性 Permalink to "全局属性"

这里的 全局属性 也是指挂载在 构造函数 的 一级属性，属性名字全部都是大写的形式，未来容易发生变动，基本上用不到

DEBUG Permalink to "DEBUG"

是否开始 debug 模式，可以打印出视频全部的内置事件，默认关闭

▶ Run Code

Artplayer.DEBUG = true;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

STYLE Permalink to "STYLE"

返回播放器样式文本

▶ Run Code

console.log(Artplayer.STYLE);

CONTEXTMENU Permalink to "CONTEXTMENU"

是否开启右键菜单，默认开启

▶ Run Code

Artplayer.CONTEXTMENU = false;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

NOTICE_TIME Permalink to "NOTICE_TIME"

提示信息的显示时长，单位为毫秒，默认为 2000

▶ Run Code

Artplayer.NOTICE_TIME = 5000;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

SETTING_WIDTH Permalink to "SETTING_WIDTH"

设置面板的默认宽度，单位为像素，默认为 250

▶ Run Code

Artplayer.SETTING_WIDTH = 300;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    setting: true,
    loop: true,
    flip: true,
    playbackRate: true,
    aspectRatio: true,
});

SETTING_ITEM_WIDTH Permalink to "SETTING_ITEM_WIDTH"

设置面板的设置项的默认宽度，单位为像素，默认为 200

▶ Run Code

Artplayer.SETTING_ITEM_WIDTH = 300;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    setting: true,
    loop: true,
    flip: true,
    playbackRate: true,
    aspectRatio: true,
});

SETTING_ITEM_HEIGHT Permalink to "SETTING_ITEM_HEIGHT"

设置面板的设置项的默认高度，单位为像素，默认为 35

▶ Run Code

Artplayer.SETTING_ITEM_HEIGHT = 40;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    setting: true,
    loop: true,
    flip: true,
    playbackRate: true,
    aspectRatio: true,
});

RESIZE_TIME Permalink to "RESIZE_TIME"

resize 事件的节流时间，单位为毫秒，默认为 200

▶ Run Code

Artplayer.RESIZE_TIME = 500;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

art.on('resize', () => {
    console.log('resize');
});

SCROLL_TIME Permalink to "SCROLL_TIME"

scroll 事件的节流时间，单位为毫秒，默认为 200

▶ Run Code

Artplayer.SCROLL_TIME = 500;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

art.on('scroll', () => {
    console.log('scroll');
});

SCROLL_GAP Permalink to "SCROLL_GAP"

view 事件的边界容差距离，单位为像素，默认为 50

▶ Run Code

Artplayer.SCROLL_GAP = 100;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

art.on('scroll', () => {
    console.log('scroll');
});

AUTO_PLAYBACK_MAX Permalink to "AUTO_PLAYBACK_MAX"

自动回放功能的最大记录数，默认为 10

▶ Run Code

Artplayer.AUTO_PLAYBACK_MAX = 20;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    autoPlayback: true,
});

AUTO_PLAYBACK_MIN Permalink to "AUTO_PLAYBACK_MIN"

自动回放功能的最小记录时长，单位为秒，默认为 5

▶ Run Code

Artplayer.AUTO_PLAYBACK_MIN = 10;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    autoPlayback: true,
});

AUTO_PLAYBACK_TIMEOUT Permalink to "AUTO_PLAYBACK_TIMEOUT"

自动回放功能的隐藏延迟时长，单位为毫秒，默认为 3000

▶ Run Code

Artplayer.AUTO_PLAYBACK_TIMEOUT = 5000;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    autoPlayback: true,
});

RECONNECT_TIME_MAX Permalink to "RECONNECT_TIME_MAX"

发生连接错误时，自动连接的最大次数，默认为 5

▶ Run Code

Artplayer.RECONNECT_TIME_MAX = 10;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/404.mp4',
});

RECONNECT_SLEEP_TIME Permalink to "RECONNECT_SLEEP_TIME"

发生连接错误时，自动连接的延迟时间，单位为毫秒，默认为 1000

▶ Run Code

Artplayer.RECONNECT_SLEEP_TIME = 3000;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/404.mp4',
});

CONTROL_HIDE_TIME Permalink to "CONTROL_HIDE_TIME"

底部控制栏的自动隐藏的延迟时间，单位为毫秒，默认为 3000

▶ Run Code

Artplayer.CONTROL_HIDE_TIME = 5000;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

DBCLICK_TIME Permalink to "DBCLICK_TIME"

双击事件的延迟事件，单位为毫秒，默认为 300

▶ Run Code

Artplayer.DBCLICK_TIME = 500;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

art.on('dblclick', () => {
    console.log('dblclick');
});

DBCLICK_FULLSCREEN Permalink to "DBCLICK_FULLSCREEN"

在桌面端，是否双击切换全屏，默认为 true

▶ Run Code

Artplayer.DBCLICK_FULLSCREEN = false;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

MOBILE_DBCLICK_PLAY Permalink to "MOBILE_DBCLICK_PLAY"

在移动端，是否双击切换播放暂停，默认为 true

▶ Run Code

Artplayer.MOBILE_DBCLICK_PLAY = false;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

MOBILE_CLICK_PLAY Permalink to "MOBILE_CLICK_PLAY"

在移动端，是否单击切换播放暂停，默认为 false

▶ Run Code

Artplayer.MOBILE_CLICK_PLAY = true;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

AUTO_ORIENTATION_TIME Permalink to "AUTO_ORIENTATION_TIME"

在移动端，自动旋屏的延迟时间，单位为毫秒，默认为 200

▶ Run Code

Artplayer.AUTO_ORIENTATION_TIME = 500;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    autoOrientation: true,
});

INFO_LOOP_TIME Permalink to "INFO_LOOP_TIME"

信息面板的刷新时间，单位为毫秒，默认为 1000

▶ Run Code

Artplayer.INFO_LOOP_TIME = 2000;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

art.info.show = true;

FAST_FORWARD_VALUE Permalink to "FAST_FORWARD_VALUE"

在移动端，长按加速的速率倍数，默认为 3

▶ Run Code

Artplayer.FAST_FORWARD_VALUE = 5;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    fastForward: true,
});

FAST_FORWARD_TIME Permalink to "FAST_FORWARD_TIME"

在移动端，长按加速的延迟时间，单位为毫秒，默认为 1000

▶ Run Code

Artplayer.FAST_FORWARD_TIME = 2000;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    fastForward: true,
});

TOUCH_MOVE_RATIO Permalink to "TOUCH_MOVE_RATIO"

在移动端，左右滑动进度的速率倍数，默认为 0.5

▶ Run Code

Artplayer.TOUCH_MOVE_RATIO = 1;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

VOLUME_STEP Permalink to "VOLUME_STEP"

快捷键调节音量的幅度比例，默认为 0.1

▶ Run Code

Artplayer.VOLUME_STEP = 0.2;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

SEEK_STEP Permalink to "SEEK_STEP"

快捷键调节播放进度的幅度，单位为秒，默认为 5

▶ Run Code

Artplayer.SEEK_STEP = 10;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

PLAYBACK_RATE Permalink to "PLAYBACK_RATE"

内置播放速率的列表，默认为 [0.5, 0.75, 1, 1.25, 1.5, 2]

▶ Run Code

Artplayer.PLAYBACK_RATE = [0.5, 1, 2, 3, 4, 5];

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    setting: true,
    playbackRate: true,
});

art.contextmenu.show = true;
art.setting.show = true;

ASPECT_RATIO Permalink to "ASPECT_RATIO"

内置视频长宽比的列表，默认为 ['default', '4:3', '16:9']

▶ Run Code

Artplayer.ASPECT_RATIO = ['default', '1:1', '2:1', '4:3', '6:5'];

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    setting: true,
    aspectRatio: true,
});

art.contextmenu.show = true;
art.setting.show = true;

FLIP Permalink to "FLIP"

内置视频翻转的列表，默认为 ['normal', 'horizontal', 'vertical']

▶ Run Code

Artplayer.FLIP = ['normal', 'horizontal'];

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    setting: true,
    flip: true,
});

art.contextmenu.show = true;
art.setting.show = true;

FULLSCREEN_WEB_IN_BODY Permalink to "FULLSCREEN_WEB_IN_BODY"

网页全屏时，是否把播放器挂在在 body 元素下，默认为 true

▶ Run Code

Artplayer.FULLSCREEN_WEB_IN_BODY = false;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    fullscreenWeb: true,
});

LOG_VERSION Permalink to "LOG_VERSION"

设置是否打印播放器版本，默认为 true

▶ Run Code

Artplayer.LOG_VERSION = false;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

USE_RAF Permalink to "USE_RAF"

设置是否使用 requestAnimationFrame ，默认为 false，目前主要用于进度条的平滑效果

▶ Run Code

Artplayer.USE_RAF = true;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    miniProgressBar: true,
});

REMOVE_SRC_WHEN_DESTROY Permalink to "REMOVE_SRC_WHEN_DESTROY"

在销毁播放器时，是否同时移除视频的 src 属性并调用 load() 以主动释放媒体资源，默认为 true。

开启后可以在单页应用或频繁创建/销毁播放器的场景下，减少视频资源占用；如果你希望保留 video 元素的状态，仅移除界面，可将其设置为 false。

▶ Run Code

Artplayer.REMOVE_SRC_WHEN_DESTROY = false;

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

// 只销毁界面，不主动清空 src
art.destroy();