Androidブラウザでviewportのwidth指定

このエントリーをはてなブックマークに追加

AndroidブラウザはiPhoneのようにviewportのwidthに数値が指定できません。(ネットを見ていると指定できると書いているページもよくあるのでデバイスによって違うのかも?)

タイムリーに@takazudoが同じようなことをやっていて、対応方法が公開されていました。

ただ、私の検証環境、IS01やGALAXY S、Androidシミュレータだとうまく動かず。デバイスの実装差異かなんかかな。

で、色々と試行錯誤していたのですが、meta要素で「content="width"」を指定せず、JavaScriptで次のように指定すると「content="width=640"」っぽい表現が可能です。

$(window).bind('resize load', function(){
	$("html").css("zoom" , $(window).width()/640 );
});

ウィンドウサイズにあわせてzoomプロパティを使ってWebページを拡大縮小してしいます。

それにしてもAndroidブラウザは謎な仕様が多い。

追記

最近の使っている方法を追記しました。

続:Androidブラウザでviewportのwidth指定

関連エントリー

iPhone/iPadでダブルタップが利用できるjQueryプラグイン「jquery.event.dblTap.js」
jQueryでiPhone/iPadの向きを検出する
iPhone/iPadでPCと同じJavaScriptのイベントを実装する
PC用とiPhone用のサイトを切り替える.htaccess
iPhone用CSSをメディアクエリで分岐する問題点

スポンサードリンク

«『jQuery逆引きマニュアル』読者モニター募集します! | メイン | 「新春座談会 このコンピュータ書がすごい! 2011年版」で拙著が紹介されました»

このエントリーのトラックバックURL
http://blog.webcreativepark.net/cgi/mt/mt-bt.cgi/804
コメント

もしかしたら、Android自体のバージョンによって搭載されるブラウザのバージョンも違うからなのかしれないですね……。

投稿者:juner | 2011年1月11日 09:22

>junerさん

その可能性もありますね。なにぶん情報が少ないのでいろいろと手探り状態で模索中です。

投稿者:西畑一馬 | 2011年1月11日 13:52
コメントを投稿