Youtubeの動画を使って、ジャンケンのプログラムを書いてみました。
グー、チョキ、パーの３通りを出している動画を１つ用意します。
以前、Youtubeの動画を指定の時間から開始する方法をご紹介しましたが、
↑こちらの方法とは別で 「embed」 で動画を埋め込み、「start」 と 「end」 のプロパティを使ってみました。
動画を１０秒から２０秒まで再生したい場合は、↓こちらのような感じになります。
＜iframe src="http://www.youtube.com/embed/XXXXXXXXXXX?start=10&end=20"＞＜/iframe＞'
そして、ブラウザを開くたびに、
この ＜iframe を ランダムで３パターン作るように、Javascriptで書いてみました。
$(function(){
var min = 1; var max = 3;
var rand = Math.floor( Math.random() * (max + 1 - min) ) + min ;
if(rand % 3 == 0){ s = 0; e = 16; }else if(rand % 3 == 1){ s = 17; e = 32; }else if(rand % 3 == 2){ s = 33; e = 48; }
$('#div20180111_2030_01').html('
});
チョキは０秒から、グーは１７秒から、パーは３３秒から開始といったようにします。
これでブラウザをリロードするたびに、１つの動画から、グー、チョキ、パーがランダムで再生されます。
もし、リロードせずに変えたい場合はもう少し複雑になりますね。