ウェブサイトに埋め込んだYoutubeの動画が再生されている間だけ動画の周りに枠を付けたいです。
上手くいかなかったコード
HTML
<div id="waku"> (youtube埋め込みアドレス) </div>jQuery
jQuery(function($) {
$("#waku").on("click", function(e){
if($(".html5-video-player").hasClass('playing-mode')){
$("#waku").css("border", "3px solid red");
}else{
$("#waku").css("border", "3px solid #fff");
}
});
});
html5-video-playerというクラスのついたdivが再生させれている間のみplaying-modeというクラスが付与されているようでしたので、それをhasClassで分岐させることで実現できるかと思ったのですが、恐らくhasClassが埋め込み動画内では動かないのか、上手くいきませんでした。
また$("#waku").on("click", function(e){の箇所も間違っているように思うのですが、Youtube埋め込み動画のどこの部分がクリックされた場合にするべきかわからなかったです。
Youtube埋め込み動画の状態を判定するには特殊な方法が必要なのでしょうか?それとも、そもそもYoutubeの埋め込み動画の状態をjQueryで判定するのは無理なのでしょうか?
何卒よろしくお願い申し上げます。
あなたの回答
tips
プレビュー