Skip to main content
Version: 4.x


Default set of controls for when you're in a hurry. The controls displayed depend on whether the media is audio/video/live, and whether the device is mobile/desktop. See vime-default-ui for visuals.


<vime-player>  <!-- ... -->  <vime-ui>    <!-- ... -->    <vime-default-controls active-duration="2750"></vime-default-controls>  </vime-ui></vime-player>


activeDurationactive-durationThe length in milliseconds that the controls are active for before fading out. Audio players are not effected by this prop.number2750
hideOnMouseLeavehide-on-mouse-leaveWhether the controls should hide when the mouse leaves the player. Audio players are not effected by this prop.booleanfalse
hideWhenPausedhide-when-pausedWhether the controls should show/hide when paused. Audio players are not effected by this prop.booleanfalse
waitForPlaybackStartwait-for-playback-startWhether the controls should wait for playback to start before being shown. Audio players are not effected by this prop.booleanfalse


Used by#

Depends on#


graph TD;  vime-default-controls --> vime-controls  vime-default-controls --> vime-playback-control  vime-default-controls --> vime-volume-control  vime-default-controls --> vime-current-time  vime-default-controls --> vime-control-spacer  vime-default-controls --> vime-scrubber-control  vime-default-controls --> vime-live-indicator  vime-default-controls --> vime-end-time  vime-default-controls --> vime-settings-control  vime-default-controls --> vime-control-group  vime-default-controls --> vime-fullscreen-control  vime-default-controls --> vime-scrim  vime-default-controls --> vime-caption-control  vime-default-controls --> vime-time-progress  vime-default-controls --> vime-pip-control  vime-playback-control --> vime-control  vime-playback-control --> vime-icon  vime-playback-control --> vime-tooltip  vime-volume-control --> vime-mute-control  vime-volume-control --> vime-slider  vime-mute-control --> vime-control  vime-mute-control --> vime-icon  vime-mute-control --> vime-tooltip  vime-current-time --> vime-time  vime-scrubber-control --> vime-slider  vime-scrubber-control --> vime-tooltip  vime-end-time --> vime-time  vime-settings-control --> vime-control  vime-settings-control --> vime-icon  vime-settings-control --> vime-tooltip  vime-fullscreen-control --> vime-control  vime-fullscreen-control --> vime-icon  vime-fullscreen-control --> vime-tooltip  vime-caption-control --> vime-control  vime-caption-control --> vime-icon  vime-caption-control --> vime-tooltip  vime-time-progress --> vime-current-time  vime-time-progress --> vime-end-time  vime-pip-control --> vime-control  vime-pip-control --> vime-icon  vime-pip-control --> vime-tooltip  vime-default-ui --> vime-default-controls  style vime-default-controls fill:#f9f,stroke:#333,stroke-width:4px

Built with StencilJS