このページはビデオ投稿のテストです。

     2015/09/28   PC    ぽち

前の投稿でビデオをアップした際に、WordPress内蔵のMediaElement.jsを使って

[video mp4=”https://pochilog.jp/sys/wp-content/uploads/2015/02/xxxxxxx.mp4″][/video]

としたところ、iPhoneで確認すると縮小して表示されませんでした。はみ出しちゃう。レスポンシブデザインがvideoタグに対して効いていないのですね。

twentyfifteen等にテーマを切り替えると縮小されるので、stinger5のCSSまたはfunctions.phpが悪さをしているのだろうと調べると、CSSでした。

.wp-video,
.mejs-offscreen,
.mejs-container,
.svg,
.wp-video-shortcode,
.mejs-video,
.mejs-inner,
.mejs-mediaelement,
.mejs-time-total { /*d7r*/
max-width: 100% !important;
}

上記をstyle.cssに足してもまったく効かず、ほとほと困り果てていたところ、stinger5の新バージョンのCSSをコピーしてきたらあっと今に直りました。

stinger5ver20141123ではダメ、stinger5ver20141227では正常に表示です。stinger5ver20141123は改造していますので、FileMergeで比較してみましたが、未だ原因は分かっていません。stinger5ver20141123にバグがあるのではなく、私の改造に間違いがあったものと思われます。

     2015/09/28   PC    ぽち

コメントを残す

 こちらの記事も読んで見ましょう

このページはビデオ投稿のテストです。 EOS Kiss X7・M5・8000D・α7のお散歩カメラブログ。写真とか料理とか。

Copyright©ぽちろぐ,2015 All Rights Reserved.

ページ先頭へ