Bootstrap Vertical Carousel

Web Information

垂直カルーセルを実装できる「Bootstrap Vertical Carousel」

Bootstrap Vertical Carouselは、Bootstrapを活用した垂直カルーセルを実装することができます。滑らかなアニメーションで切り替わっていく垂直カルーセルは、サイト内にちょっとしたアクセントをプラスしたい人にはピッタリですね。

Bootstrap Vertical Carousel

Bootstrap Vertical Carousel

デモではカルーセルが自動で垂直にスライドしながら切り替わっていきます。全部で5つの内容がローテーションされます。

カルーセルの右端には上下の矢印アイコンが設置されていて、ここから上下好きな方向へスライドさせることが可能です。全体的なデザインもとてもシンプルなので、いろんなサイトに合わせやすそうですね。

ブログなら関連記事や人気記事をカルーセルでさりげなく見せる、なんていう使い方もアリかと思います。スペースの有効活用にもなるし、アニメーションすることで注目させることもできるはず。

というわけで、滑らかな上下スライドアニメーションによる垂直カルーセルを実装したい人は、ぜひ「Bootstrap Vertical Carousel」をチェックしてみてはいかがでしょうか。

jQuery ui material design datepickerマテリアルデザインによるデートピッカー「jQuery ui material design datepicker」前のページ

iPhone 7で4K動画(4K/30 fps)を撮影するための設定方法次のページiPhone 7で4K動画撮影の設定方法

関連記事

  1. Web Information

    iPhoneのSafari(サファリ)でリンク先を新規タブで開く方法

    iPhoneのSafari(サファリ)でブラウジングしている時にリンク…

  2. 新刊チェッカー for Kindle

    Web Information

    Kindleの最新情報(セールや新刊)が分かるiPhoneアプリ「新刊チェッカー for Kindl…

    Kindle(キンドル)のセールや新刊などの最新情報をiPhoneから…

  3. Copy All Urls

    Web Information

    たくさんのWebページURLを一気にコピーするChrome拡張機能「Copy All Urls」

    現在ひらいているタブのWebページURLをまとめて一気にコピーしたいと…

  4. Web Information

    Google検索で日付や期間指定をして検索結果を表示する方法

    Googleで調べたいものを検索した時に「どうも古い情報しか出てこない…

  5. Googleブログ検索

    Web Information

    Googleブログ検索がなくなったと思ったらまだちゃんとあった

    Googleブログ検索を検索結果ページから絞り込んでよく利用していたん…

  6. Web Information

    Facebookページを作成する場合の手順

    Facebookページを作成するまでの手順をメモがてら記事にしてみまし…

最近の記事

  1. DCG-CA21
  2. Apple WatchでのMacロック解除を無効
  3. オータムスイートポテトフラペチーノ
  4. 紅葉
  5. ナノケア EH-NA0E

アーカイブ

PAGE TOP