ax5ui-menu

JavaScript

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

ax5ui-menuはカスタマイズしやすいシンプルなコンテキストメニューを実装できます。jQuery、ax5core、Bootstrapが使用されているとのこと。テーマもいくつか用意されていて、どれもシンプルなデザインで飽きがなく、いろんなサイトに合わせやすそうですね。

ax5ui-menu

デモ

デモでは「Right click on the mouse.」と書かれた領域内で右クリックをすると、ax5ui-menuによって作られたコンテキストメニューが表示されます。Menu AとMenu Bというメニューリストが表示され、さらに両方とも子メニューを持っています。入れ子になっていて、各メニューにマウスオーバーすると下の階層のメニューが表示される仕組みです。

こちらはContext Menuのデモですが、他にもチェックボックスが付いたものやアイコンが付いたもの、テーマを変更できるものなどいろんなパターンのデモが用意されています。

ちなみにThemeのデモでは、default、Primary、info、warning、dangerの中から好きなテーマを選択して見ることが可能です。

実装面ではitemsの中にメニューを入れていきます。表示させるメニュー名はlabelに指定し、子リストを設定したい場合はitems内にさらにitemsを入れていくかたちです。

実際のコードの記述例はデモページに載っているので、詳しく知りたい人はぜひチェックしてみてください。

ax5ui-menu

関連記事

  1. Sticky Slider Navigation(Responsive)
  2. jQuery Glow
  3. Multi-Level Menu

    JavaScript

    流れるような遅延アニメーションが美しい階層化メニュー実装「Multi-Level Menu」

    Multi-Level Menuは流れるような遅延アニメーションが美し…

  4. JavaScript

    回転するアニメーション付きの円形ナビゲーションを実装できる「wheelnav.js」

    wheelnav.jsは回転する円形のナビゲーションを実装することがで…

  5. DarkTooltip

    JavaScript

    色んなパターンのツールチップを実装できるjQueryプラグイン「DarkTooltip」

    DarkTooltipというjQueryプラグインを使えば、色んなパタ…

  6. Sliding Panels Template

最近の記事

  1. 梅しば
  2. BM-IBCDH13RD
  3. 雪
  4. ホットのドリップ
  5. めんたいこ&チーズ味 海老せんべい

アーカイブ

PAGE TOP