Change or hide the pause button or the loading bar

Rene Villanueva 3 years, 6 months ago

I would like to change the image of the pause button and the image of the loading bar that appear when a video is been changed or finished.

After a video has finished playing from the playlist it autoplays to another video that follows. Before it load the next video the pause button appears or the loader image (loading bars – | | | | ) and then it loads the video.

is there a way to change that to display another image for example the logo of my website or can i hide it completely that it doesn’t show it.

I have attached the image of what i want to change or remove.

Capture-pause-button

Viewing 2 replies - 1 through 2 (of 2 total)

Rene Villanueva 4 years ago

attached is the loader that i will not like to be shown. I would like to change the image or do not show it at all

loader
Mária Stašová 4 years ago
Hello Rene,

thank you for your question!

Here is the CSS to hide the pause button:
```
.flowplayer .fp-pause {
    display: none !important;
}
```
This CSS will hide the loading animation:
```
.flowplayer.is-splash .fp-preload, .flowplayer.is-poster .fp-preload, .fp-waiting .fp-preload {
    display: none;
}
```
To change the loading animation to your own logo, use this and change the background url to your own logo:
```
.flowplayer.is-splash .fp-preload, .flowplayer.is-poster .fp-preload, .fp-waiting .fp-preload{
  background: url(https://cdn.foliovision.com/images/2017/11/Play-Music-icon.png) center no-repeat;
  background-size: 19%;
}
.fp-preload b { display: none }
```
You can learn how to use CSS with FV Player here: https://foliovision.com/player/advanced/css-tips-and-fixes

Making the web work for you,
Maria

Viewing 2 replies - 1 through 2 (of 2 total)