スクロールとズームを取得するテスト

上のを参考にスクロールとズームの動作を取得するテストページを作った。

スクロールするとwindow.onscrollイベントが発生。
左上の座標はwindow.pageXOffset,window.pageYOffsetで、
「いま見えてる範囲のサイズ」はwindow.innerWidth,window.innerHeightで取得できる。

iPod touch向けgooglemap

googlemapをiPod touch向けに作ってみたVer.1

googlemapの特徴であるところのマウスドラッグによるスクロールが、touchでは使えないので、とりあえずの対応として、クリックしたところが中心に移動するようにした。

位置移動してbookmarkすると、その位置から開けます。

touchのブラウザのUIである、スクロールや拡大といった操作ができてないので、本当のtouch用にするにはもうちょっと工夫の余地がありそう。


入力フォームに入力しようとすると、強制的に画面が拡大されて、入力終了後に元にもどらないのはなんとかならないのか・・・・

追記

viewportのwidth=320にした場合、font-sizeを16px以上にしておくと、上記の強制拡大が起こらないことを発見。

Safariで動画再生

html

Safariで動画再生をするためのタグ。embedだけでよい。サムネイル画像はsrcで指定。

フォーマットは(たぶん)転送して再生可能なものは大丈夫。
実際にはブラウザ上で再生されるわけではなくて、再生ボタンを押すとQTプレイヤーが起動して再生される。縦モードでも横モードでも再生可能。

追記

embedのアトリビュートでほかに使えるものがないかちょっと調べてみた。
autoplayやloopは使えなくて当然という感じだが、なんとqtnextが動いた。これで連続して複数のムービーを再生することができる。まあ、次のムービーを再生するときにコントローラーが表示されてしまう難点はあるが、これでプレイリストも作れるということになる。

向きを取得するイベント

js

当初無いとされていた、iPod touch本体の向きを取得するイベントが、1.1.1のファームで追加されたようだ。
向きが変わると、bodyのonOrientationChangeイベントが上がり、window.orientationの値で向きが分かるようになっている。
実例サンプルはこちら http://touch.wakufactory.jp/sample/orientation.html

iPod touchでの画像の拡大

tips

iTunes経由でsyncした画像は、どんなに大きくても一定サイズに縮小されてとりこまれてしまう。
したがって拡大も限界があり、高解像度の画像を拡大して細部まで見るのには適さない。

Safari経由だと、大きな画像もフルサイズまで拡大することができる。
さらに、htmlに張り付けてviewportタグでmaximum-scaleを指定すると、dot by dot以上に拡大することも可能。
高解像度画像をオフラインで持ち出せれば、路線図とかを持っておくのに便利なんだが、dataスキームでオフライン化するには画像だと大すぎる。