前々からクリック時に :hover
のスタイルが出たりするなあと思ってたのですが iOS has a :hover problem | NCZOnline を読んで、すっきりしました。
iOS の Safari/WebView で、:hover
でスタイル変わるリンクをタップした場合、一旦 :hover
時のスタイルが表示されてからリンク先のページへ飛びます。
ただし :hover
によって要素が消えたり現れたりする場合(visibility
または display
)、一度のタップでは次のページへ行かず、:hover
のスタイルのまま止まるようです。そして、もう一度タップすると、リンク先のページへ飛びます。
Apple のドキュメント によると、タップの際に mouseover, mousemove, mousedown, mouseup, click
の順でイベントが発生するが、mouseover, mousemove
のところでコンテンツに変化があると、それ以降のイベントは発生しないとのこと。
回避するには Modernizr による .no-touch
を使う方法などがあるようですが、この挙動を意図的に使うこともできそうです。