How to Hide Vimeo Controls

问题

Our students are provided with video tutorials using Vimeo.

Once a student was done with watching the videos, s/he is presented with some quizzes.

What we discovered was that the students would use fast Forward control to move the slider forward to shorten the time it takes to watch the videos.

We want to stop that and we are wondering if there is a way to either disable or hide the fast Forward control so students are no longer able to move forward to shorten the video time.

Thanks for your help

回答1:

Make sure you are logged into Vimeo.
Go to the video settings page: https://vimeo.com/{enter_video_id}/settings/embed
Uncheck Show Play Bar under Player Preferences

Edit: You must have a Plus or Pro account to use these features.

回答2:

We can control all things in iframe see EX.

title=0   for title hide
sidedock=0  for social icon hide
controls=0 . for button hide

<iframe class="iframe" src="//player.vimeo.com/video/191777290?title=0&byline=0&portrait=0&sidedock=0" width="100%" height="430" frameborder="0" webkitallowfullscreen   mozallowfullscreen allowfullscreen>

回答3:

This is my solution to prevent Vimeo fast forward - I made interaction with Vimeo API that is really brilliant.

Script remembers the moment of the video where user try to fast forward. Then js will go back to right place.

Your video:

<iframe src="{{ $video_path }}" width="100%" height="500px" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

Remember to add vimeo script:

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

JavaScript logic:

 let iframe = document.querySelector('iframe');
 let player = new Vimeo.Player(iframe);
 let playing = false;
 let simulationTime = 0;

 player.on('play', function(e) {
     playing = true;
 });

 player.on('pause', function(e) {
     playing = false;
 });

 /**
 * Event fired when user want to fast forward
 */
 player.on('seeked', function(e) {
     if (e.seconds > simulationTime) {
         player.setCurrentTime(simulationTime).then(function(seconds) {
         }).catch(function(error) {
            switch (error.name) {
                case 'RangeError':
                    // The time is less than 0 or greater than the video's duration
                    break;
                default:
                    // Some other error occurred
                    break;
            }
         });
     }
     else {
         simulationTime = data.seconds;
     }
 });

 /**
 * Keep time going
 */
 window.setInterval(function() {
     if (playing) {
         simulationTime++;
     }
 }, 1000);

Cheers!

来源：https://stackoverflow.com/questions/24971297/how-to-hide-vimeo-controls

标签

jquery

vimeo

vimeo-api