デバイス別、クロスブラウザ別対応 – not useragent - シンプルシンプルデザイン JavaScript
もはや他ブラウザでも問題ないようにクロスブラザ対応だけでなく、スマートフォンやタブレット端末などマルチデバイスに対応できるようになっておかなければ、という時代になって1,2年が経ちました。 「プログレッシブエンハンスメント」や「グレイスフルデグラデーション」、「メディアクエリ」、「CSSスプライト」、「モバイルファースト」というキーワードも聞かれるようになりました。 あ、最大のキーワードは「html5」。これは広義にも狭義にも使われてますね。 このような流れを受けてか、ビジュアルデザインは大きく、フォントも大きくなったサイトを見かけることが多くなった気がします。 結果見やすく、アクセシビリティにも良い印象。個人的にも素材を大きくダイナミックな表現は好みなので見てて楽しいです。 っとデザインの話しではなく、クロスブラウザ、マルチデバイスにどう対応するか。 そのコンテンツのユーザーは誰か？をデ
スマホでマウスオーバー - シンプルシンプルデザイン JavaScript
スマートフォン（以下スマホ）やタブレットでPCでいうところのマウスオーバー処理をしたいときは、touchイベントを使うことで実現できる。 確かAndroid1.6とかでtouchイベントに対応していない端末があったような気がするが、touchイベントに対応しているか判別すればいいわけで、デバイスがPCだろうがスマホだろうがタブレットだろうが関係ない。 実装イメージ touchイベントを認識するか？ しない→clickイベントで処理（マウスオーバーは普通にCSSで） する→clickフラグ用の変数を用意。 タップした（ontouchstart）ときに見た目を変えるCSSやclass名をセットする。 タップしたところから移動（ontouchmove）したら、clickフラグを無効に。 タップを離した（ontouchend）とき、 タップしたときにセットしたCSSやclass名を取り消す。 cl
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScriptでIEかどうかの判別 - シンプルシンプルデザイン JavaScript
