BeefUp

JavaScript

多彩なカスタマイズができるjQueryアコーディオンプラグイン「BeefUp」

BeefUpは多彩なカスタマイズができるレスポンシブに対応したjQueryアコーディオンプラグインです。アニメーションやコールバックなど、シンプルながらもいろんなカスタマイズを施すことが可能です。

BeefUp

デモ

デモではベーシックなタイプのものからフェードアニメーションで表示・非表示するもの、アコーディオンを展開した時にスクロールするもの、コールバックによりオープン時とクローズ時でボーダーカラーを変更するものなど、さまざまな種類のアコーディオンを見ることができます。

ほかにも、タブ化させたりドロップダウンにしたりといろんなセッティングが可能です。

デモはレスポンシブにも対応しているので、ブラウザの横サイズを変更してもそれに合わせて可変します。

シンプルながらも柔軟性がありカスタマイズ性にも優れているのがいいですね。

オプションも豊富で、アニメーションの指定やオープン/クローズ時のスピード調整、スクロールの有無、スクロールスピードの設定など、好みに合わせたカスタマイズができます。

また、コールバック関数にはonInit、onOpen、onClose、onScrollといったものが用意されています。

BeefUp

no-imageページ読み込み時に画面上部にプログレスバーを表示する「Skylo」前のページ

レスポンシブでスタイリッシュな「lightbox-jquery-plugin」次のページno-image

関連記事

  1. jQuery RS Carousel

    JavaScript

    レスポンシブ対応のシンプルなカルーセルを実装できる「jQuery RS Carousel」

    レスポンシブ対応のシンプルなカルーセルを実装できるjQueryプラグイ…

  2. JavaScript

    jQueryプラグイン・2014年上半期56選まとめ

    気づいたら2014年も上半期が終わってしまいましたね。そんなわけで、2…

  3. no-image

    JavaScript

    フォームに文字制限を設定できるjQueryプラグイン「Character Limit」

    Character Limitは、フォーム要素に文字制限を設定するため…

  4. Glide.js

    JavaScript

    軽量・フレキシブル・高速なスライダー&カルーセル実装「Glide.js」

    Glide.jsは軽量・フレキシブル・高速なJavaScript ES…

  5. JavaScript

    レスポンシブに対応したビフォーアフター画像を実装できる「before-after.js」

    before-after.jsはシンプルでレスポンシブに対応したビフォ…

  6. JS Form Validator

    JavaScript

    HTMLフォームの検証を簡単に実装できる「JS Form Validator」

    JS Form ValidatorはHTMLフォームの検証を簡単に実装…

最近の記事

  1. 甘柿
  2. 冬用のふとん
  3. 田沢湖
PAGE TOP