はじめに

タイトル通り、Reactで生成した要素にホバーアクションを実装してブルンブルン動かしたくなったのでやってみました。

開発環境

VsCode
npm 6.12.1

何パターンか方法があるらしいですが、今回はGithubからソースファイルを引っ張ってきてローカルに保存する方法でやってきます。

https://github.com/IanLunn/Hover
上記サイトのcssフォルダ配下にあるhover-min.cssをダウンロードして、ローカルの適当なフォルダに配置します。

プロジェクトの上位のスタイルファイルで、保存したhover-min.cssをimportします。

@import url("hover-min.css");

これでHover.cssを使える状態になったので、ブルンブルンさせたい要素に対してクラスをつけてあげます。

    <div className="hvr-grow">

サーバを起動して確認してみましょう。

楽ちんですね。