KumarinX Kaneko Ryogen Jean Michel Kaneko Photography MacOSX

くまりんが見てた 携帯電話と iPhone に対応

iPhone でもちゃんと見られるサイトに

f:id:lovelovebear:20081127210601j:image:right

 はてな touchiPhone から更新することになれてきたけど、flickr の写真を flickr が用意してくれるコードでそのまま挿入すると画像が大きくて画面からはみ出しで見にくい。ようは width="500" の画像がそのまま表示されてしまう。おまけに iPhone ならまだ表示されるが au だとエラーで表示もされない。なにか方法はないものかと hatena fotolife の写真をはてな記法で挿入してみるとこれはちゃんとサムネイルが表示され iPhone だけでなく au でも表示される。

 そこでブラウザのソースを表示で当該の画像を見てみるとイメージタグの中に class="hatena-fotolife" の記述を見つけた。このクラスがモバイルページではサムネイルを表示するように定義されている模様。そもそもはてな記法で WIDE:500 と定義してもモバイルでは無視されてちゃんとサムネイルになる。でも width="500" は実行されてしまうのでイメージタグの中からサイズ定義を取り去ることにした。サイズ定義を取り去るとブラウザでレイアウトする際に画像のサイズはレイアウトされないから表示中にテキストが下へ押しやられるようにずずっとずれ込むけれどいまやブロードバンドの時代、ほとんど気にならないだろう。

 というわけでうちのはてなダイアリーもこれでちゃんと iPhone でモバイルバージョンが表示されるようになった。とは言ってもはてなのモバイルバージョンは http://m.なんたら とiPhone専用の CSS を用意しているわけではなく携帯端末汎用なので iPhone がタテだとちょっと文字が小さくて見難いがヨコむきにすればちょうどよいサイズになる。iPhone でうちのサイトを見ている方は以下の URI をブクマしてください。

くまりんが見てた!モバイル版
http://d.hatena.ne.jp/kumarin/mobile?

♪BGM while writing

ザ・ベスト・オブ・ボブ・ディラン

ザ・ベスト・オブ・ボブ・ディラン