Skip to main content

Control Plugin

Demo​

πŸ‘‰ View Demo

Install​

Install from npm:​

$ npm install artplayer-plugin-control

Install from yarn:​

$ yarn add artplayer-plugin-control

Install from script:​

<!-- local -->
<script src="path/to/artplayer-plugin-control.js"></script>

<!-- jsdelivr -->
<script src="https://cdn.jsdelivr.net/npm/artplayer-plugin-control/dist/artplayer-plugin-control.js"></script>

<!-- unpkg -->
<script src="https://unpkg.com/artplayer-plugin-control/dist/artplayer-plugin-control.js"></script>

Then you can access the plugin function through window.artplayerPluginControl

Use​

β–Ά Run Code
var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    fullscreen: true,
    fullscreenWeb: true,
    plugins: [
        artplayerPluginControl(),
    ],
});

Api​

enable​

  • Type: Getter/Setter

Whether to enable the new control UI

β–Ά Run Code
var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    fullscreen: true,
    fullscreenWeb: true,
    controls: [
        {
            position: 'right',
            html: '<button type="button">Switcher UI</button>',
            click: function () {
                const { enable } = art.plugins.artplayerPluginControl;
                art.plugins.artplayerPluginControl.enable = !enable;
            },
        },
    ],
    plugins: [
        artplayerPluginControl(),
    ],
});
``