Hover Carousel

JavaScript

超軽量なホバーカルーセルを実装できる「Hover Carousel」

Hover Carouselは超軽量なホバーで動作するカルーセルを実装することができます。カルーセルに設置された画像にマウスオーバーすることで、左右への移動を可能にしているのが特徴です。容量がとても軽量なところがいいですね。

Hover Carousel

デモ

デモではサムネイル画像がいくつか横に並んでおり、マウスオーバーすることで画像リストを左右にスライド移動できるようになっています。

ホバー中は、画像リストの下部にナビゲーションバーも表示されるので、自分がいまどのあたりの位置にいるのかを瞬時に把握することができます。

シンプルですが、ファイル容量も軽いのでサクサク動作するのがいいですね。ちょっとしたカルーセルタイプの画像ギャラリーをサクッと自サイトに実装したいなんてときに活用してみてはいかがでしょうか?

というわけで、以上、超軽量なホバーによるカルーセルを実装することができる「Hover Carousel」のご紹介でした。

Hover Carousel

Background Blur画像をボカしてくれるクロスブラウザ対応の「Background Blur」前のページ

ホバーによるチルトエフェクトを実装できる「Tilt Hover Effects」次のページTilt Hover Effects

関連記事

  1. JavaScript

    色んなメニューやコンテンツをモーダルウィンドウで実装できるjQueryプラグイン「Pop Easy」…

    お洒落で可愛らしいjQueryプラグインを見つけたのでご紹介します。ロ…

  2. iziToast

    JavaScript

    エレガントでレスポンシブに対応したトーストを実装できる「iziToast」

    iziToastは、エレガントでレスポンシブに対応した軽量のトーストを…

  3. jcSlider

    JavaScript

    CSS3を使ったレスポンシブ対応スライダーを実装できるjQueryプラグイン「jcSlider」

    jcSliderは、アニメーションを使用しないスライダーのプラグインで…

  4. no-image

    JavaScript

    指定したテキストをハイライトとタイピング効果で表示できる「typeLighter.js」

    typeLighter.jsは、指定したテキストをハイライトとタイピン…

  5. FSVS(Full Screen Vertical Scroller)
  6. Animate Transition

最近の記事

  1. スタバ ドリップコーヒー
  2. エチオピア
  3. 紗々 飴色和栗
  4. DCG-CA21
  5. Apple WatchでのMacロック解除を無効

アーカイブ

PAGE TOP