no-image

JavaScript

シンプルでスタイリッシュなjQueryスライダー「Simple slider」

Simple sliderはシンプルでスタイリッシュなスライダー(カルーセル)を実装できるjQueryプラグインです。フェードとスライドを組み合わせた、さりげない美しさを備えたアニメーションが魅力的です。

Simple slider

Simple slider

デモでは画面横幅いっぱいに伸びた横長のスライダーが設置されており、自動でスライドされていきます。スライダーにマウスオーバーすると左右両端に矢印アイコンが表示されます。ここから画像を前後移動させることが可能です。

フェードとスライドを組み合わせた美しいアニメーションがとても素敵ですね。また、デモはレスポンシブにも対応しているので、画面の横幅を縮小・拡大してもそれに合わせて可変します。

PCはもちろん、モバイルにも最適なスライダーといえそうです。

というわけで、シンプルでスタイリッシュなスライダー(カルーセル)を実装したい人は、ぜひ「Simple slider」をチェックしてみてください。

関連記事

  1. JUMBLE

    JavaScript

    テキストの色をカラフルにシャッフルさせるjQueryプラグイン「JUMBLE」

    JUMBLEというjQueryプラグインを使えば、指定したテキストの色…

  2. jQuery TextFill

    JavaScript

    テキストをリサイズしてコンテナにフィットさせる「jQuery TextFill」

    jQuery TextFillはテキストをリサイズしてコンテナにフィッ…

  3. JavaScript

    フルスクリーンで画像などの要素を表示させることができるJSライブラリ「screenfull.js」

    screenfull.jsは画像などの要素をフルスクリーンで表示させる…

  4. Circular Slider
  5. jquery.mark

    JavaScript

    キーワードをハイライトしてくれる「jquery.mark」

    jquery.markはキーワードをハイライトしてくれるjQueryプ…

  6. no-image

    JavaScript

    さまざまなデバイスに対応したパララックスを実装できる「PARALLAX」

    PARALLAXは、さまざまなデバイスに対応したシンプルなパララックス…

最近の記事

  1. Waterlogue
  2. macOS Mojaveのダークモード
  3. Olli
  4. 単語帳メーカー(Flashcard Maker App)

Facebookページ

PAGE TOP