Woco Accordion jQuery plugin

JavaScript

スムーズなアニメーションでシンプルなアコーディオン実装「Woco Accordion jQuery plugin」

Woco Accordion jQuery pluginはスムーズなアニメーションでシンプル&軽量なアコーディオンを実装することができます。Minimal Accordion/Drawer Plugin with jQuery and CSS3がベースになっているとのこと。

Woco Accordion jQuery plugin

Woco Accordion

縦に並んだ親メニューをクリックすると子メニューが滑らかなアニメーションとともにスライドダウンで表示されます。もう一度クリック(または他の親メニューをクリック)するとスライドアップで子メニューが非表示になります。

子メニューがたくさんある時に、できる限りシンプルにスッキリとしたナビゲーションメニューを実装したい場合によさそうですね。

ちなみにオプションを用いることでスライドスピードを調節することが可能です。

シンプルで軽量なプラグインなので表示スピードへの負担もそんなにかかりませんし、操作も簡単なことからとてもユーザーフレンドリーな設計だと思います。

iPhoneでも確認してみたところちゃんとアニメーション動作しました。

というわけで、パソコンやスマホでも動作できるスムーズなアニメーションのアコーディオンを実装したい方は是非チェックしてみてください。

StickyStack.jsパネルにスタッキング効果を実装できるjQueryプラグイン「StickyStack.js」前のページ

iPhoneのSafariですべてのタブを一気に閉じる設定方法次のページiPhoneのSafariですべてのタブを閉じる

関連記事

  1. no-image
  2. Accessible Dialog

    JavaScript

    ナビゲーションメニューをモーダルダイアログで表示する「Accessible Dialog」

    Accessible Dialogは、ナビゲーションメニューをモーダル…

  3. jQuery Timespace

    JavaScript

    四方にドラッグ移動できる水平タイムライン実装「jQuery Timespace」

    jQuery Timespaceは上下左右と四方にドラッグ移動できる水…

  4. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQueryでパターン化されたクラス名をループで1つずつ取り出して処理する

    どうでもいい内容なんですがちょっとやりたかったのでメモです。jQuer…

  5. Timeline.js

    JavaScript

    スライド式のタイムラインを実装できるjQueryプラグイン「Timeline.js」

    Timeline.jsは、スライド式によるタイムラインを実装することが…

  6. Brusher

    JavaScript

    インタラクティブな背景を実装できる「Brusher」

    Brusherはインタラクティブな背景を実装できる軽量なJavaScr…

最近の記事

  1. スタバ ドリップコーヒー
  2. エチオピア
  3. 紗々 飴色和栗
  4. DCG-CA21
  5. Apple WatchでのMacロック解除を無効

アーカイブ

PAGE TOP