Version: 2.67.0

How to make the control bar always visible?

The question above is typically asked by developers who want to be able to see the control bar at all times without having to continuously move the cursor over it (or tap the screen).

SDKs

Web SDKAndroid SDKiOS SDKtvOSAndroid TV SDKChromecast SDK
YesThrough CSS injectionThrough CSS injectionN/AN/AN/A

Code examples

Web SDK

The following CSS line is aimed at overwriting the opacity transition and have the controlbar always visible.

.theo-secondary-color.vjs-control-bar {
opacity: 1 !important;
}

Android SDK

To achieve the same result on Android SDK, the same CSS need to be passed to your app.

Step 1

To learn how to inject CSS into your Android project, follow the guide  Android SDK Customization - Custom CSS and JavaScript files.

Step 2

In the CSS file you created, add the code reported above in the Web SDK section.

iOS SDK

To achieve the same result on iOS SDK, the same CSS need to be passed to your app.

Step 1

To learn how to inject CSS into your iOS project, follow the guide iOS SDK Customization - Custom CSS and JavaScript files.

Step 2

In the CSS file you created, add the code reported above in the Web SDK section.