2011-12-19 9 views
3

現在Wordpress用のmediaelement.jsプラグインを使用していますが、うまくいくようです。mediaelement.jsを使用してレスポンシブなデザインのHTML5ビデオを取得する

@mediaアトリビュートを使用して初めてのレスポンシブなCSSデザイン/テーマを作成しようとしたところ、mediaelement.jsパワードビデオが拡大縮小されていないか、画面のサイズに反応していないことに気付きました。

CSSを設定しても、mediaelement.jsが独自のインラインCSSスタイルシートを積極的に配置しているようです。

これを念頭において、mediaelement.jsを使用して、レスポンスごとにビデオを拡大することは可能ですか?

おかげ

答えて

5

私もmediaelementjsを使用しています。レスポンシブルデザインの中で私にとって完全にスケーリングされているようです。

私は、githubのMEjs開発者であるJohn Dyerのヒントに従いました。そこ

彼はあなたのvideoタグ内にインラインスタイルを含める必要があることを指摘し

<video style="width:100%;height:100%;"> 

彼は他のいくつかのポインタを作るんので、私はhttps://github.com/johndyer/mediaelement

+0

ありがとう!それは有り難いです。あなたはそれをやらなければならないのは少しばかげているようですが、もしあなたがそれをしなくてはならないと思います。私は今それを受け入れますが、さらなるコメントを歓迎します。 – zardon

+0

私は同じインラインスタイルのテクニックを使用していますが、いくつかのstackoverflowスレッドを掘り下げてからdemos/mediaelementplayer-responsive.htmlドキュメントを見ています。 – starpause

-1
object, embed, video, iframe { 
max-width:100%; 

}

+0

meidaelementでgithubのページをチェックアウトすることをお勧めWordpress用の.jsプラグインにはインラインスタイルシートがあります。つまり、div、クラス、スパンなどの幅はすべて固定幅です。私はインラインスタイルシートを削除して別のCSSファイルに配置しようとしましたが、ブラウザ画面が変更されたときには、誤った位置にオーバーレイが表示され、スケーリングが行われません。 – zardon

関連する問題