css - タッチ デバイス無効要素のホバー

Question

これは少し奇妙な質問かもしれません。モバイルでホバーすると、別のアイテムをクリックするまでホバー状態のままになります。しばらくしてから、またはページがスクロールされたときにホバーを削除したいと思います。何かアドバイス。

Answer 1

この場合、メディア クエリを使用できます。デスクトップのユーザーをターゲットにする場合:

@media screen { /* hover styles here */ } 

また、モバイル デバイス (iPad など) をターゲットにする場合は、次のように使用できます。

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* non-hover styles here */
}