IE8からAndroidまでワンソースで対応できちゃう
Media Element.JS
っていう動画プラグインがある。
WordPressの動画再生部分のコアにも採用されてるところからも、
優秀さが伺えるんだけど、
それのレスポンシブ対応に迷ったのでメモ。
記述があったのはこちら
http://coolestguidesontheplanet.com/videodrome/mediaelementjs/
普通に設置して、
縦横指定するところに
style=”width:100%;height:100%;”
width=”100%” height=”100%”
を追加。
これで、縦横幅は親要素依存にできます。
タネがわかれば簡単なのだけど、すごく目鱗だな……!
<video id="my_video_1" style="width:100%;height:100%;" controls="controls" width="100%" height="100%" preload="auto" poster="my_video_poster.png" <source src="my_video.mp4" type='video/mp4'> </video>