CSS

【CSS】30スタイルのCSS3ホバーエフェクトFox hover

May 22, 2017
foxhover

Fox hoverは30スタイルのオーバーレイエフェクト、イメージエフェクト、キャプションエフェクトを使用したCSS3ホバーエフェクト。

サポート

CROSSBROWSER (IE10+, SAFARI 7+, FF, CHROME, OPERA)

How to Use

<div class="effect eff-1">
  <img src="img/your-own-path" alt="Your own text" />
  <div class="caption">
    <h4>Title is Here</h4>
    <div class="text">
      <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut.</p>
    </div>
    <a class="btn" href="your link" title="View More">View More</a>
  </div>
</div>
<head>
  <link rel="stylesheet" href="css/foxhover.min.css" />
</head>

or

<head>
  <link rel="stylesheet" href="css/foxhover.css" />
</head>

MIT