Bootstrap Dropdown Hoverは、ホバーによるシンプルなドロップダウンメニューを実装できるjQueryプラグインです。Bootstrapが使われています。操作・デザイン共にとてもシンプルでいろんなサイトに合いそうですね。
Bootstrap Dropdown Hover
以下のページからBootstrap Dropdown Hoverの実際のデモをチェックできます。
デモではいろんなタイプのドロップボタンが設置されています。「Dropdown」というボタンにマウスオーバーすると、その直下にシンプルなメニューがサッと表示されます。
また、「Dropup」というボタンにマウスオーバーすると、ボタンの真上にメニューが表示されます。
ほかにも、ボタンの大きさが異なるタイプやタブ形式の中に組み込まれているタイプなど、さまざまなサンプルが用意されています。
オプションには、clickBehaviorとhideTimeoutという項目があります。clickBehaviorの値は、sticky、default、disableの中からセッティングできます。デフォルト値はstickyです。
また、hideTimeoutのデフォルト値は200になります。
そのほか、メソッドにはsetClickBehavior(value)、setHideTimeout(value)、destroy()が用意されています。
というわけで、Bootstrapを使ったホバーによるシンプルなドロップダウンメニューを実装できるjQueryプラグイン「Bootstrap Dropdown Hover」の紹介でした。
ラインセンスはApache Licenseになります。Bootstrap Dropdown Hoverの詳細やダウンロードは、以下のページからどうぞ。
