Plyr: Vimeo controls displaying behing Plyr controls
Issue is visible on plyr.io website (https://plyr.io/#vimeo)
Expected behaviour
Plyr controls should only be visible
Actual behaviour
Both Vimeo and Plyr controls are visible
Environment
- Browser: Chrome (latest)
- Version: Plyr 2.0.16
Players affected:
- Vimeo
Steps to reproduce
- Embed Vimeo as per docs
Relevant links
lukeyouell
All 27 comments
it happened to me too !
aymenpeak
on 27 Oct 2017
me too
weskhaled
on 27 Oct 2017
Argh, Vimeo really is crap. I think it might be time to drop support. There's no way to hide their controls via the API so we had a kinda hack to hide them off screen (iframe was 200% height and then centered in the viewport) but clearly that's no longer working. Either they found it on someone's site or they discovered Plyr. A really downer.
I think the options are either we drop support or keep it but using their controls which would offer an inconsistent experience and frankly not as good looking.
It's a shame as they have some good quality videos but when it comes to embedding that content on your own website, YouTube far exceeds them and even they have their downsides.
sampotts
on 27 Oct 2017
As a temporary solution, I'm placing non-transparent plyr control over vimeo's one. And only in case of non-fullscreen, because in fullscreen the is no such problem for now.
Also, had to add defaultDelay to my fork of plyr to show plyr controls longer than vimeo's one.
yuriykuzin
on 27 Oct 2017
This has happened to me as well, but it is possible to turn the controls off in the embed settings:
It's not perfect, and they then add a "play" button to the centre of the video, but it works well enough to make continuing to use Plyr viable. And the good news is Plyr can get rid of that Vimeo hack to hide controls now, since it's no longer of any use.
BrunoDeBarros
on 31 Oct 2017
Is it possible to turn them off for everyone? I was planning to just use their "native" controls for now and add an option to the config to turn on the custom controls.
sampotts
on 31 Oct 2017
I'm afraid it's something people have to do themselves. People can use an embed preset that turns controls off, and then assign it to every one of their videos, which does the trick (that's what I did for 100+ videos), but there's no way for Plyr to control anything.
Perhaps the best option is to disable the custom controls by default (like you already do in iOS), but allow people to use them with a custom config option, so those of us who are OK with the settings workaround I described earlier can keep making use of the custom controls bar (which of course, would have to be documented).
Either way, what a pain supporting Vimeo must be! Thank you so much for all the effort you put into Plyr.
BrunoDeBarros
on 1 Nov 2017
Looks like these embed settings are only available for Vimeo PRO, Plus and Business members...
https://help.vimeo.com/hc/en-us/articles/224972808-Customizing-the-embedded-player
hatsumatsu
on 1 Nov 2017
Yes, they are, sadly, which is why I suggested it not be a default workaround. They're there for those of us who use Vimeo/Plyr for business.
BrunoDeBarros
on 1 Nov 2017
Are there any insights into what's causing this issue? I can pass along information to Vimeo's dev team if there's something off with the interaction between those two systems.
danaburger
on 2 Nov 2017
Hey @danaburger , it's always been their intention to display their controls on embedded videos. I just took advantage of a loophole that allowed them to be hidden. A loophole they've now closed unfortunately.
sampotts
on 2 Nov 2017
interesting, what was the loophole? (if you don't mind me asking)
danaburger
on 2 Nov 2017
So the usual way to display an iframe in 16:9 is to sit it in an container with 0 height and padding bottom of 56.25% (to create 16:9) and then make the
Most helpful comment
I've just pushed v2.0.17 with the iframe fix in. Let me know if you find any issues. There's some other small bug fixes in there too:
https://github.com/sampotts/plyr/releases/tag/v2.0.17