最近まで、YouTube で埋め込みコードを取得すると、OBJECT タグで埋め込まれていたようなのですが、今は IFRAME で取得できるようなので、この処理が可能です。 通常のブログですと、幅640で埋め込んでも特に問題無いですが、スマホで表示するとはみ出てしまいます。その対応処理です。 .text iframe とありますが、Seesaa のブログでは本文の class が text なので、その中の iframe に対して処理を行っています
<script type="text/javascript">
(function(){
var str = "";
var userAgent = window.navigator.userAgent.toLowerCase();
if (userAgent.indexOf("iphone") > -1 || userAgent.indexOf("android") > -1 ) {
str+="<style type=\"text/css\"> \n";
str+=".text iframe { \n";
str+=" width:290px!important; \n";
str+=" height:auto!important; \n";
str+="} \n";
str+="</style> ";
document.write(str);
}
})();
</script>
<iframe width="640" height="480" src="http://www.youtube.com/embed/uxBFiU2N65c" frameborder="0" allowfullscreen></iframe>
iPhoneAndroid
|
|
【JavaScript コンテンツの最新記事】
- jQuery の ajax でアクセス可能なデータをボタンをクリックした後 window.open で開いたウインドウの中にテキストエリアを作成して表示する方法
- IFRAME を ブラウザのサイズ変更時のイベントでコントロールして、HTML5で廃止された FRAME と同様に使うサンプル
- JavaScript : DIV 内に時間範囲のボックスを表示する処理
- jQuery/JavaScript : 存在しない可能性のある画像の代替表示
- JavaScript による、時間範囲の表現( 出退勤等 )
- JavaScript : HTML 特殊文字を書き出すコード( ツール )
- Twitter 縦書き intent
- IFRAME で埋め込んだ外部コンテンツから情報を取得する事ができる postMessage インターフェイス
- WEB フォントを使った「フェードイン、フェードアウト」
- JS : テキストエリア内の選択文字列の置き換え
- IE限定、ローカルファイル参照フィールドを使ったトリック
