abc123
abc123

Reputation: 8303

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

Upvotes: 32

Views: 71625

Answers (5)

Karl Zillner
Karl Zillner

Reputation: 614

2020 answer

For embed video player you can use parameters ?controls=0 or ?pip=0

If you 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>

Upvotes: 6

Antonija Šimić
Antonija Šimić

Reputation: 478

You need to go to Settings of the video, then to Distribution > Video File Links. Then copy one of the formats links, for example Standard def.

enter image description here enter image description here

Upvotes: 0

OACDesigns
OACDesigns

Reputation: 2299

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

  1. All player toggles and elements will be turned off (including the play/pause button!)
  2. The video will automatically loop.
  3. The video will be set to autoplay.
  4. 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

Upvotes: 50

jruutu
jruutu

Reputation: 27

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>

Upvotes: 1

user2473959
user2473959

Reputation: 41

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.

Upvotes: 4

Related Questions