クリックしてyoutube iframeの下にdivを隠す

Question

私はyoutube video（ 'div #player'）をクリックして 'div .blind'を非表示にします。どうすればいいですか？例えば

：

JS: 
 
... 
 
var player; 
 
function onYouTubeIframeAPIReady() { 
 
\t player = new YT.Player('player', { 
 
\t \t videoId: 'Lo3rrP8u7Mw', 
 
\t \t playerVars: { 
 
\t \t \t 'wmode': 'transparent', 
 
\t \t \t 'color': 'white', 
 
\t \t \t 'modestbranding': 1, 
 
\t \t \t 'showinfo': 1 
 

 
\t \t }, 
 
\t \t events: { 
 
\t \t \t 'onReady': onPlayerReady, 
 
\t \t \t 'onStateChange': onPlayerStateChange 
 
\t \t } 
 
\t }); 
 
...

CSS: 
 
.video .blind { 
 
    display: block; 
 
    width: 300px; 
 
    height: 300px; 
 
    background-color: black; 
 
    }

HTML: 
 
<div class="video"> 
 
    <div id="player" ></div> 
 
    <div class="blind" id="blind"></div> 
 
</div> 
 

 
<div class="video"> 
 
    <div id="player2" ></div> 
 
    <div class="blind" id="blind"></div> 
 
</div>

Answer 1

あなたは「ユーチューブの動画をクリック」で意味を正確にわからない動画が再生されている間、私はあなたがあなたの要素を非表示にしたいと仮定？

最も良い実装は、onStateChangeイベントをリスニングすることによって要素の表示状態を変更することです。

あなたのonPlayerStateChange機能に以下のコードを実装できます。また、https://developers.google.com/youtube/iframe_api_reference#onStateChange