web-dev-qa-db-fra.com

Pouvez-vous masquer les commandes d'une intégration YouTube sans activer la lecture automatique?

<iframe width="100%" height="100%" src="//www.youtube.com/embed/qUJYqhKZrwA?autoplay=1&showinfo=0&controls=0" frameborder="0" allowfullscreen>

Si vous supprimez? Autoplay = 1, la vidéo ne fonctionne pas. On dirait que vous ne pouvez pas utiliser le paramètre controls sans la lecture automatique activée. 

Vous ne savez pas pourquoi cela n'est pas mentionné dans la description intégrée de YouTube.

J'espère que je me trompe.

https://developers.google.com/youtube/player_parameters#controls

youtube
49
Joe Isaacson

Set autoplay = 0

<iframe width="100%" height="100%" src="//www.youtube.com/embed/qUJYqhKZrwA?autoplay=0&showinfo=0&controls=0" frameborder="0" allowfullscreen>

Comme on le voit ici: Autoplay = 0 Test

109
Alice

Pour continuer à utiliser l'iframe YouTube, il vous suffira de changer ?autoplay=1 en ?autoplay=0.

Une autre façon d’y parvenir serait d’utiliser l’API du lecteur JavaScript de YouTube. ( https://developers.google.com/youtube/js_api_reference )

Edit: l'API du lecteur JavaScript de YouTube n'est plus prise en charge.

<div id="howToVideo"></div>

<script type="application/javascript">

    var ga = document.createElement('script');
    ga.type = 'text/javascript';
    ga.async = false;
    ga.src = 'http://www.youtube.com/player_api';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(ga, s);

    var done = false;
    var player;

    function onYouTubePlayerAPIReady() {
        player = new YT.Player('howToVideo', {
            height: '390',
            width: '640',
            videoId: 'qUJYqhKZrwA',
        playerVars: {
            controls: 0,
            disablekb: 1
        },
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
    }
    function onPlayerReady(evt) {
        console.log('onPlayerReady', evt);
    }
    function onPlayerStateChange(evt) {
        console.log('onPlayerStateChange', evt);
        if (evt.data == YT.PlayerState.PLAYING && !done) {
            setTimeout(stopVideo, 6000);
            done = true;
        }
    }

    function stopVideo() {
        console.log('stopVideo');
        player.stopVideo();
    }

</script>

Voici un jsfiddle pour l'exemple: http://jsfiddle.net/fgkrj/

Notez que les contrôles du lecteur sont désactivés dans la partie "playerVars" du lecteur. Le seul sacrifice que vous faites est que les utilisateurs peuvent toujours mettre la vidéo en pause en cliquant dessus. Je suggérerais d'écrire une simple fonction javascript qui s'abonne à un événement stop et appelle player.playVideo().

11
Jonn

utiliser autoplay=0

la lecture automatique prend 2 valeurs.

Values: 0 or 1. Default is 0. Sets whether or not the initial video will autoplay when the player loads.

la partie importante 

autoplay=0&showinfo=0&controls=0

Voici la démo pour votre problème FIDDLE

8
Ajey

Si vous ajoutez ce ?showinfo=0&iv_load_policy=3&controls=0 avant la fin de votre src, tout le logo sauf le logo YouTube situé en bas à droite sera supprimé.
exemple de travail: http://jsfiddle.net/42gxdf0f/1/

4
Andrei
?modestbranding=1&autohide=1&showinfo=0&controls=0

autohide=1

est quelque chose que je n'ai jamais trouvé ... mais c'était la clé :) J'espère que c'est de l'aide

2
vuchkov

Suivez ceci https://developers.google.com/youtube/player_parameters pour plus d'informations sur les contrôles vidéo tels que:

<iframe id="video_iframe" width="660" height="415" src="http://www.youtube.com/v/{{course_url}}?start=7&autoplay=0&showinfo=0&iv_load_policy=3&rel=0"
                frameborder="0"
                allowfullscreen></iframe>

start = 7 & autoplay = 0 & showinfo = 0 & iv_load_policy = 3 & rel = 0 "frameborder =" 0 " 

tous les contrôles y sont décrits

1
GrvTyagi

Pour retirer votre tube controls et title, vous pouvez faire quelque chose comme ceci 

<iframe width="560" height="315" src="https://www.youtube.com/embed/zP0Wnb9RI9Q?autoplay=1&showinfo=0&controls=0" frameborder="0" allowfullscreen ></iframe>

code avec sortie

showinfo=0 est utilisé pour supprimer le titre et &controls=0 pour supprimer les contrôles tels que volume, play, pause, deploy.

0
Umang Patwa