tabarkaのブックマーク - はてなブックマーク

スマホ対応の参考に。JavaScriptでウェブページがどのくらい拡大されているのかを取得する方法。
こんにちは。開発担当の林です。 iPhone / iPad のウェブブラウザでページを見ているとき、けっこうな割合でピンチイン・ピンチアウトすると思いますが、それがどのくらい拡大されているのかを取得する方法を書きます。また、応用でピンチイン・ピンチアウトされても、見た目のサイズを維持するにはどのくらい拡大すれば良いかということにも触れたいと思います。広告バナーなんかでよく使われてるアレの仕組みです。何かのお役に立てれば幸いです。ウェブページがどのくらい拡大されているのかを取得する // ページの幅 ÷ 表示されている幅（この行だけでいいかな） var zoomer = document.body.clientWidth / window.innerWidth; // 以下で拡大率を目視できるでしょう alert( zoomer ); // 小数点がたくさんつくので、第二位までに丸め込
tabarka 2012/08/31
リンク
実は違う。クロスブラウザでの gif アニメーション再生速度の合わせ方。
*Safari 5.0 系は Ienternet Explorer と同じで 0.06秒からしか対応してません。対応している速度よりフレームレートが短くなると明らかに遅くなっているのが分かると思います。各ブラウザで対応しているフレームレートの限界を超えると、強制的に 0.10秒になります。（Safari、Google Chrome など一部のブラウザでは違う）以上のことからクロスブラウザで gif アニメーションの再生速度を合わせる方法は、フレームレートを 0.06秒までにすることです。 gif アニメーションを作る、またはこれから作ってみたいと思っている方は、フレームレートは 0.06秒まで！ということを覚えておくといいかと思います。
tabarka 2012/04/06
gifアニメ
リンク
iPhone/Android/PC 対応。jQuery で書くタッチイベント
こんにちは！プロダクト企画担当の林です。今回は、前回予告していた通り、タッチイベントについて書かせていただきます。他所でもタッチイベントについて取り扱っていますが、当記事でのポイントは、 jQuery を使っている。（jQuery Mobile は不要です） iOS / Android で動作確認済み。タッチできない PC の場合、マウスで動く。この３点です。こちらを実際に動作するコードにて解説します。動作確認環境タッチ環境 → iPhone / iPad / Android マウス環境 → Sleipnir / IE / Firefox / Google Chrome / Safari / Opera タッチイベントについてタッチイベントとは、スマートフォンなどで画面を直接指でタッチしたときに発生するイベントのことです。イベントの種類 touchstart : タッチし
tabarka 2011/06/11
リンク
1