パンプキンスパイスラテ

IT系のことが多めの日記帳です

iPhoneでウェブ閲覧する際に、ちょっと便利なブックマークレットを作った

iPhoneでウェブサイトを見るときに、「ダブルタップ」や「ピンチアウト」で拡大することができますよね。
「ダブルタップ」のほうが片手でできて簡単なのですが、これってHTMLの「ブロック要素単位」で拡大する仕様のようで、リキッドレイアウトのサイトでは、「ダブルタップ」で拡大しても、本文がまだ読みやすいサイズにはならないのです。
そのため、「ピンチアウト」でさらに拡大するのですが、間違えてリンクを触ったりしてしまい、残念な感じになることもしばしば。
さらに、読みやすいサイズに拡大したとしても、横スクロールが発生してしまい、とても読みづらいです。
◆通常

◆ダブルタップ

◆ピンチアウト

そこで下記のブックマークレットを実行!

javascript:(function(){for(i=0;i<document.getElementsByTagName("div").length;i++){document.getElementsByTagName("div")[i].style.maxWidth="400px"}})();

◆ブックマークレット実行後

◆ブックマークレット実行後ダブルタップ

ちょうど良い感じに横幅が狭まり、「ダブルタップ」で読みやすいサイズに拡大できます!
ブックマークレットでやってることは簡単。
すべての「div要素」の横幅を400pxに指定しているだけです。

iPhoneでブックマークレットを作成する方法

http://javascript:(function(){for(i=0;i<document.getElementsByTagName("div").length;i++){document.getElementsByTagName("div")[i].style.maxWidth="400px"}})();
    1. 上記のように、先頭に「http://」を追加したものをブラウザのURL欄にコピペ。
    2. そのページを開く。
    3. エラーになるが、そのまま「ブックマーク追加」ボタンを押す。
    4. 編集画面でURLから「http://」を削除したものを登録。

これであなたもiPhoneで快適ブラウジングを♪