jQueryを用いてDrag ＆ Dropを実装。
その際のサンプルソースを紹介します。
9月 252012
7月 242012
5月 182012
5月 172012
【 主なスマートフォン機種の画像解像度 】
| 機種名 | キャリア | 画像解像度 |
| GALAXY S Ⅱ LTE SC-03D | docomo | 480 x 800 ピクセル |
| Xperia SO-01B | docomo | 480 x 850 ピクセル |
| Xperia SO-02D | docomo | 720 x 1280 ピクセル |
| AQUOS PHONE IS14SH | au | 540 x 960 ピクセル |
| iida INFOBAR A01 | au | 540 x 960 ピクセル |
| iPhone 3GS | SoftBank | 320 x 480 ピクセル |
| iPhone 4 / 4S | SoftBank、au | 640 x 960 ピクセル |
【 Viewportと画像解像度の違い 】
ViewPortとは、コンテンツ表示領域のこと。ステータスバー、コントロールボタンを覗いた画像領域を指す。
必ずしも画像解像度＝ViewPort ではない。
例としてiPhone 4 を紹介。
iPhone 4の画面解像度は、640ピクセル。
iPhoneのViewPortのデフォルト値は、980ピクセル。
ここに、幅320ピクセルの画像が入ったHTMLを表示すると、横幅の1／3 に画像が表示される。
もちろん、ViewPortの設定値が320ピクセルだったら、画面いっぱいに画像は表示される。
これは、iPhoneの標準ブラウザである、Mobile SafariのViewPortの幅が980ピクセルの為。
jQuery Mobileを用いてスマフォ向けサイトを作る時は、次のような指定をすること。
<meta name="viewport" content="width=device-width, initial-scale=1">
上記コードの意味は、幅をデバイス幅にする、初期拡大率を1にする。この設定をしておけば、jQuery Mobileを利用して作られたサイトは、どのスマフォでも適切なサイズで表示されるようになる。
5月 132012
5月 122012
まずはサンプルコードの画面イメージから。
Galaxy S2で見た時のキャプチャー画面。クリックすると大きくなります。
4月 262012
前からHTML5には興味があったのだが、以下のサイトを見て、ビビッと身体に電気が走った。(ビビビッではない、ビビビッだと松田聖子になってしまう)
HTML5サンプル集・デモリンク集まとめ / HTML5の普及の序章(8)
という事で、最近、技術的な事を殆ど勉強していないので本格的に勉強しようと思う。
まだまだ何も分からない事だらけ。あせらず、一歩一歩理解して行こう。
最終目標としては、
・HTML5のホームページを開設する(HTML5のカテゴリ数が20を超えたら作ってOK)
・小生が持っているホームページをHTML5で作る（万歩計、お買い得、Etc）
・HTML5でスマフォアプリを公開する
・HTLM5のホームページで、無料テンプレートを公開する(下部にタブ付き、取りたければ1000円おくれみたいな)
・本を出版したい（本を出すのは長年の夢）
ざっ と書き出した所、こんな感じでしょうか。
情報も多そうだし、まずは簡単な本を購入しようと思います。
記事ネタを考えてみる
１．そもそもHTML5って何？
２．HTML5で作られたアプリってどんなのがあるか？
２－１ HTML5を使うと何のメリットがあるの？
２－２ 各ブラウザの対応状況ってどんな感じ？
２－３ 各スマフォの対応状況ってどんな感じ？
３．HTML5って難しいの？
小生が経験した言語と比較する ⇒ Java、VB6、.Net、PHP、JavaScript、Etc
どんなコードを書けばどんな事が出来るの？
４．これからやっぱり主流になるの？
５．サンプル見せて
６． スマフォの各機能のどれだけ実装されているの？
７．HTML5を作るには、何から勉強すれば良いの？（HTMLは知ってるけど）
８．HTML5のサンプルコード１
９．HTML5のサンプルコード2
１０．HTML5のサンプルコード３