あまりやることも無いけど、急に必要になったので調べてみた。
記述はこれだけ。
ただ、今回ぶつかったのが、動画のすぐ上にプルダウンメニューがある場合、何もしない状態だとIEではプルダウンが裏に回ってしまって選択できなくなってしまう。
なので、動画側では wmode=”transparent”を入れ、z-indexでは重ね順を1で一番下に入れました。
それでなんとなくクリア。
<div style="z-index:1;"> <script type="text/javascript"><!-- (function(){ var list = [ "http://www.youtube.com/v/QlYfO1R83A8", "http://www.youtube.com/v/sOzuWBc4wOo", "http://www.youtube.com/v/Z4vIQ70XBzM" ]; var src=list[Math.floor(Math.random()*list.length)]; document.write('<embed src="' + src + '" type="application/x-shockwave-flash" wmode="transparent" width="560" height="345"></embed>') })(); //--> </script> </div>
↓結果はこちら。
リロードすると動画がかわります。
なんのこっちゃ?って?www
—
▼html5での再生
HTML5のvideoタグによる動画再生(Safari/Google Chrome向け)