no-image

JavaScript

画面が半分に割れながら切り替わる縦型スライドショー「Split Slick Slideshow」

Split Slick Slideshowは、画面が真ん中から半分に割れながら切り替わる縦型のスライドショーを実装できます。ダイナミックなアニメーションで切り替わるスライドショーを求めている人にはピッタリですね。CSSとJSで構築されています。

ナビゲーションからも操作可能

デモ

デモでは画面いっぱいに広がった風景画像が表示されていて、上下にスクロールすることで次の画像に切り替えることができます。画像が半分に割れながら切り替わっていくアニメーションはとても迫力がありますね。

また、右側にはナビゲーションも設置されています。横になった線がコンテンツの数だけあり、現在開かれているコンテンツの横線が他のものより長く伸びるようになっています。

ちなみにこのナビゲーションからでも画像の切り替えが可能です。

JSのコード内を見るとわかりますが、swipe、vertical、arrows、infinite、speed、cssEaseといったオプションによるセッティングもできるみたいですね。

Split Slick Slideshow

関連記事

  1. ax5ui-menu

    JavaScript

    カスタマイズしやすいコンテキストメニューを実装できる「ax5ui-menu」

    ax5ui-menuはカスタマイズしやすいシンプルなコンテキストメニュ…

  2. JavaScript

    レスポンシブなLightbox風のギャラリーを実装できるjQueryプラグイン「anoFlow」

    anoFlowというjQueryプラグインを使えば、レスポンシブなLi…

  3. Vertical Timeline

    JavaScript

    垂直型のシンプルなタイムラインを実装できるjQueryプラグイン「Vertical Timeline…

    Vertical Timelineは、垂直型のシンプルなタイムラインを…

  4. jQuery Tabs with Content Overlays
  5. gridslide.js

    JavaScript

    いろんな方向に画像をスライドできるjQueryイメージスライダー「gridslide.js」

    gridslide.jsはいろんな方向に画像をスライドさせることができ…

  6. parallax-background.js

最近の記事

  1. ジェットストリームの三色ボールペン(+シャーペン付き)と黒の替芯
  2. ブラジルイパネマ
  3. 梅しば
  4. BM-IBCDH13RD

アーカイブ

PAGE TOP