Javascript

【Javascript】iPhone 3G用のWebページを作る1

Javascript関連情報

更新日：2008年07月19日

iPhone 3G用のWebページを作る1

高橋登史朗

今回から特別に、今月(2008年7月11日)発売されたばかりの話題の携帯 iPhone 3G 用にWebページを作る際のポイントをみてみます。今回は、ユーザーエージェントの確認とビューポートです。

width=320; initial-scale=2.0;

widthが320(デバイスの幅)、initial-scaleを2倍とした場合、ちょうど2倍に拡大されるので、iPhone画面の幅(320px)の半分で160pxまでが画面に表示されます。

サンプル3(iPhoneで見てください)
http://jsgt.org/a/080715/s3.htm

<html>
<head>
<title>Test</title>
<style>body{margin:0px;padding:0px;}</style>
<meta name="viewport" 
      content="width=320; initial-scale=2.0;">
</head>
<body>

<img src="//img.allabout.co.jp/gm/article/24189/s3.jpg">

</body>
</html>

ビューポートについてさらに詳しくは下記の資料が参考になります。
参考資料:Configuring the Viewport

次回は、iPhoneでのデバッグや制限事項などを確認し、その次の回で続けて、iPhoneのユーザーインターフェイスを簡単に実現してくれるJavaScriptライブラリを使ってみます。

マネしたくなるアイデア住宅

住まいには、人の個性がよく現れるもの。同じ空間をどのように使うかで、雰囲気も、快適さも大きく変わってくる。ここでは、「建築家と家を建てる」ガイドの川畑博哉氏が厳選した10軒を紹介し、建築家それぞれのこだわりのポイントを紹介しよう。建築のプロたちが考え出した、マネしたくなるアイデアが満載！さぁ、いますぐチェック！