【iOS】リンクをタップしても1回では挙動しない原因とは？
「iOS」の「Safari」等、モバイル端末でウェブサイトを閲覧しているとき。 リンクをタップしても1回では反応せず、2回目でようやく画面が遷移するという現象が起きていませんか？ いま実機で調べた結果、この現象が起きるのは iPhone のみ。ソフトウェアのバージョンは「iOS 8.4.1」の「Safari」と「Chrome」で確認できています。 その原因ですが、どうやら CSS の「:hover」時の挙動によるもののようです。 例えば画像（<img>）をアンカータグで囲ってリンクを設定しているとき。 <a href="../index.php"><img src="sample.png" width="300" height="200"></a> この画像に対して以下のようにスタイルシートを設定していたとします。 a img:hover{ opacity:0.5; } 上記の設定で画像を
【jQuery】iPhone や Android の反応速度向上のために「タッチイベント」を活用する方法。
【jQuery】iPhone や Android の反応速度向上のために「タッチイベント」を活用する方法。 スマートフォンサイトを作るとき、ちょっとした一手間を加えるだけで、驚くほどユーザビリティーが向上しますよ、というおハナシです。 その一手間とはズバリ、jQuery の「タッチイベント」を活用すること。 タッチイベントとは、その名のとおりスマートフォンなどで画面を直接指でタッチしたときに発生するイベントのことで、以下の４つのタイプの機能が用意されています。 touchstart ： タッチしたときに発生する touchmove ： タッチしたまま動かしたときに発生する touchend ： タッチ状態から離れたときに発生する touchcancel ： タッチ中に電話がかかってきた場合などに発生する（通常は使わない） 具体的にわかりやすいように、ここではスマートフォン用のサイトでよく使
HTML の 〜 内に書くタグの順番にも気を遣ってみた。
今アナタがご覧になっている、このオンズのウェブサイトでは読み込み速度のスピードアップや各種マークアップのクオリティ維持のために随時徹底した改善作業を行っています。 これまでも本ブログにて様々なテクニックを紹介してきましたが、今日は<head>〜</head>タグ内のコードにフォーカスして、弊社が実際に行っているHTMLマークアップの考え方を紹介していきます。 ブラウザで「要素を検証」して実際にコードを見てもらうのが手っ取り早いのですが、参考までに以下にコードをコピーして記載します。 今日（2016年1月20日）現在のオンズのウェブサイトの<head>〜</head>タグは次のように記載されています。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="author" content="//on
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
