Custom Carousel

JavaScript

カードスタイルのカルーセル・スライダー実装「Custom Carousel」

Custom Carouselはカードスタイルによるシンプルなカルーセル・スライダーを実装できます。左右のアイテムをクリックすることで、前後にスライドしていくことが可能です。操作性も簡単で、たくさんのアイテムをサクサク見ていけるのがいいですね。

Custom Carousel

Custom Carousel

デモでは左・中央・右の3枚のカードスタイルによるアイテムが表示されています。左か右のアイテムは中央のアイテムよりも薄くなっていて、ここをクリックすることで前後にスライド移動していくことができます。

また、キーボードの左右矢印キーにも対応しているので、ここから前後に移動させることも可能です。

左右のアイテムは中央に比べてサイズも一回り小さくなっているので、奥から手前に向かって移動してくるような立体感を感じさせてくれるのがいいですね。

シンプルな操作性で、次々にテンポよくカードを見ていけるところも便利です。パソコンだけでなくスマホやタブレットでも操作しやすいと思います。

滑らかなアニメーションで快適なカルーセル・スライダーを実装したい人は、ぜひ「Custom Carousel」をチェックしてみてはいかがでしょうか?

関連記事

  1. Crosscover

    JavaScript

    多彩なアニメーションがいい!シンプルで使いやすいjQueryイメージカルーセル「Crosscover…

    Crosscoverはシンプルで多彩なアニメーションが魅力的なイメージ…

  2. Product Tour

    JavaScript

    レスポンシブなプロダクトツアーを実装できるCSS・jQuery「Product Tour」

    Product Tourはレスポンシブに対応したプロダクトツアーを実装…

  3. Nivo Lightbox

    JavaScript

    Lightbox系のレスポンシブ対応のjQueryプラグイン「Nivo Lightbox」

    シンプルでレスポンシブにも対応しているLightbox系のjQuery…

  4. no-image

    JavaScript

    カスタマイズもできるダイナミックなコンタクトフォーム「Swyft Callback」

    Swyft Callbackはカスタマイズもできるダイナミックで美しい…

  5. Light-Zoom

    JavaScript

    CSSを使用した画像ズームを実装できるjQueryプラグイン「Light-Zoom」

    Light-Zoomは純粋なCSSを使用した画像ズーム(拡大)機能を実…

  6. JavaScript

    ショータイムが始まる前のスポットライトのようなjQueryプラグイン「Spotlight」

    Spotlightはショータイムが始まる前のスポットライトのようなアニ…

最近の記事

  1. YAECA ワイドテーパードデニム 10-13WW
  2. ADR-3ML39シリーズ
  3. キュレル モイスチャーバーム
  4. FUJIFILM X-Pro3
  5. iPhone 11 ProとApple Watch Hermès

アーカイブ

PAGE TOP