WIth Vimeo Plus account, how to hide/remove the "play" button in the middle of an embedded video?

In searching, I came across this that says Vimeo doesn't support it yet. But I was wondering if anyone has found clever ways around it still?

https://vimeo.com/forums/topic:37769

Here's an image:

enter image description here

Solution 1:

You can now remove all controls

just wanted to update anyone new looking at this. It now appears to be possible to have an embeded video without any of the controls, by using an experimental feature: background=1

Things to note

All player toggles and elements will be turned off (including the play/pause button!)
The video will automatically loop.
The video will be set to autoplay.
The video will be muted.

you can then use the js-api to control the video (pause, play, etc).

Example Embed Code

<iframe src="https://player.vimeo.com/video/76979871?background=1" 
   width="500" height="281" frameborder="0" webkitallowfullscreen 
   mozallowfullscreen allowfullscreen>
</iframe>

See the forum post here: https://vimeo.com/forums/help/topic:278001

Solution 2:

2020 answer

Use Vimeo SDK

Set controls option to false

var options = {
    id: '116582567',
    width: '800',
    controls: false
}

Player = new Vimeo.Player('video', options);
Player.play();

<script src="https://player.vimeo.com/api/player.js"></script>
<div id="video"></div>

Solution 3:

In your Vimeo account go to the video you wish to embed, then go to Settings > Embed. Once there enable the "Show Play Bar" option. This will eliminate the Play button in the middle of your video image, but will display the Play Bar at the bottom of your image. From what I can tell it's either/or. I would love to be able to hide both so you just see the clean poster frame of the video and click on it ti initiate playback. If anyone knows how please let me know.

Solution 4:

I hope this isn't against the Vimeo rules, but it is possible to hide those buttons.

<!-- Video original height is 280px -->
<style type="text/css" media="screen">
    #wrapper {
        overflow: hidden;
        position: relative;
        width: 500px;
        height: 560px;   /* height x 2 */
    }
    #wrapper iframe {
        position: absolute;
        left: 0px;
        top: -140px;  /* video height / 2 */
    }
</sytle>


<div id="wrapper">
    <iframe id="player1" 
        src="http://player.vimeo.com/video/83762493?loop=1&autoplay=1" 
        width="500" height="560" <!-- vide height x 2 -->
        frameborder="0">
    </iframe>
</div>