タブレットのhoverを考え直したいきっかけ最近、IE/Edge確認のためSurface goを買って使ってるんですが、ナビゲーションとかでうまく動かないサイトをたまに見かけます。 ↓は、bootstrapのhoverを利用したドロップダウンメニューライブラリbootstrap-dropdown-hoverをタブレットで操作している様子です。 ちょっとわかりにくいですが、タップしてもドロップダウンメニューが表示しないことがあります。 なにが起きてるのか？パソコンではhover時に下層メニューが表示します。 スマホでは、タブレット同様、hoverという操作は存在しませんが、タップ時に下層メニューが表示します。 これは、多くのスマホの場合、 タップしている最中 と タップ後 が :hover の擬似クラスに割り当てられているためです。 よって、CSSの :hoverクラス で実装されていればパソコン同様に操作可能です。 スマホで
