ITエンジニア/デザイナ向けにオープンソースを毎日紹介

リンクがある画像の上にマウスを載せた時に情報を追加表示できると、ユーザに見てもらえる可能性が高くなります。その際にちょっとしたアニメーションができれば、より見た目のインパクトが大きくなることでしょう。

今回紹介するIzmirはそのためのライブラリです。ユーザのブラウジングがより楽しいものになるでしょう。

Izmirの使い方

文字が出るだけでなく、画像が回転しているのが分かります。

こちらは画像が小さくなっています。

線のアニメーションが格好いいです。

ボタンを出すのも効果的です。

Izmirは文字だけでなく線もアニメーションしながら表示されます。画像の上にマウスを当てると詳細な情報を出すのも良さそうです。写真コンテンツを効果的に使えそうです。

IzmirはCSS製のオープンソース・ソフトウェア(MIT License)です。

Izmir - ImageHover CSS Library

ciar4n/Izmir: Izmir - An image hover mini CSS library

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2