私は様々なモバイルデバイスでツールチップを動作させる方法を試しています。残念ながら、私がサポートする必要があるデバイスの範囲は、NokiasからiPhoneまでの範囲です。どのようなiPhone(モバイルサファリ)がcss:hover疑似クラスで何をするのかを決めるには?
私が扱っているブラウザの中には、フォーカスのあるツールチップのtitle属性の使用をサポートしていないものがあります。このように、私は別の解決策を考え出す必要があります。手始めに
、私は純粋なCSSツールチップと一緒に遊んだ:http://psacake.com/web/jl.asp
この方法は使用しています位置に疑似クラスを置いて、ツールチップを作成するために、SPANのzインデックスを設定します。
iPhoneでは、これが奇妙な副作用を引き起こしました。リンクをタップするとツールヒントが公開され、実際にリンクをアクティブにするには2回目のタップが必要です。
ただし、単純なスタイルを別のリンクの:ホバー擬似クラス(背景色を変更する)に適用しても、同じ効果はありません。 1回タップするとスタイルとリンクの両方がトリガーされます(次のページが読み込まれる前に:ホバースタイルが短く表示されます)。
iPhone(および私が使用しているNokia製のタッチデバイス)によってトリガされないように見える:focus擬似クラスを使用して、モバイルデバイスのこの問題を解決しました。もちろん、このアプリがデスクトップブラウザでも使用されるのであれば理想的ではありません。
質問:iPhoneのSafariブラウザが、リンク上でクリックイベントを中断して:ホバー擬似クラスを公開することを決定したときと、割り込みを行わずにリンクを開始させるときのロジックについては文書化されていますか?最初のタップ?