スマホ対応の参考に。JavaScriptでウェブページがどのくらい拡大されているのかを取得する方法。
こんにちは。開発担当の林です。 iPhone / iPad のウェブブラウザでページを見ているとき、けっこうな割合でピンチイン・ピンチアウトすると思いますが、それがどのくらい拡大されているのかを取得する方法を書きます。 また、応用でピンチイン・ピンチアウトされても、見た目のサイズを維持するにはどのくらい拡大すれば良いかということにも触れたいと思います。 広告バナーなんかでよく使われてるアレの仕組みです。何かのお役に立てれば幸いです。 ウェブページがどのくらい拡大されているのかを取得する // ページの幅 ÷ 表示されている幅（この行だけでいいかな） var zoomer = document.body.clientWidth / window.innerWidth; // 以下で拡大率を目視できるでしょう alert( zoomer ); // 小数点がたくさんつくので、第二位までに丸め込
Detecting Mobile Devices with JavaScript | A Beautiful Blog
While I understand and value the concept of feature detection over browser detection, sometimes the need for knowing whether or not we’re dealing with a mobile device arises. For in-depth device checking, you can rely on a complex library such as The MobileESP Project. But for simpler applications, the following snippet can be useful. var isMobile = { Android: function() { return navigator.userA
HTML5で追加されたinput要素のタイプはiPhone、Androidでどのくらい使えるのか | DevelopersIO
HTML5でinputタグのタイブが追加されましたが、現行のiPhone、Androidでどのくらい使えるのか調べてみました。 OSとブラウザに関しては以下の機種で調べています。 iPhone 5(iOS6)のSafari Galaxy S3(Android 4.04)のGoogle Chrome バージョン18 目次 テキスト入力 検索(search) 数値(number) 電話番号(tel) URL(url) メールアドレス(email) 日付・時間指定 時間(time) 日付(date) 日時(datetime) 日時(datetime-local) 週(week) 月(month) その他 範囲から指定(range) 色選択(color) テキスト入力 まずはテキスト入力系の属性を調べてみます。 見た目が変わったり、フォーカスインした際の入力モードが変わります。 検索(search
Prevent background-color bleed on touch screens
Here’s an issue I’ve ran into a couple of times related to subpixel rounding on touch screens: while zooming in, I was seeing background colors bleeding through on the edges of an element that also had a background image applied. Open this fiddle on your smartphone or tablet and zoom in, you may see something like this: Browsing this thread on Stack Overflow I found a really simple workaround that
ke-tai.org > Blog Archive > Android端末のブラウザ仕様やバッドノウハウをまとめたスライド資料「スマートフォンブラウザ不具合特集」
Android端末のブラウザ仕様やバッドノウハウをまとめたスライド資料「スマートフォンブラウザ不具合特集」 Tweet 2012/5/7 月曜日 matsui Posted in Android, 記事紹介・リンク | No Comments » GWを挟んでしまい更新しそこねたので、少し前のものになってしまいますが、Android端末のブラウザ仕様やバッドノウハウをまとめた「スマートフォンブラウザ不具合特集」という良いスライド資料がありましたので、ご紹介させていただきます。 スマートフォンブラウザ不具合特集 View more presentations from Hiroaki Wakamatsu Android（一部iOS）のブラウザの不具合と、その回避方法がまとめられています。 実際にHTMLコーディングを行う現場の方々にとって、これは大変に貴重で役に立つ資料ではないでしょうか。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
スマートフォンの比較サイト - スマートフォンデータベース
Mobile Patterns - UI UX Inspirational Gallery for iOS and Android
スマートフォン対応、気をつけたいトラブル