hover

hoverアニメーション指定

詳しい導入事例は導入方法を参照してください。

  • DEMO
underline
back ground
shadow

使い方

クラスがごちゃごちゃになるので[data-hov=""]属性で指定。

ウィンドウサイズ770px以上で発火。

  • CSS
[data-hov] {transition: .2s;}
@media (770px < width) {
  [data-hov="txt"]:hover {text-decoration: underline;}
  [data-hov="bg"]:hover {background: var(--hover);}
  [data-hov="shdw"]:hover {box-shadow: var(--shadow-main)}
}