使い勝手のいいドロワーメニューのjQueryプラグイン「Slidebars」!

2015/12/03

こんにちは。
今回は使い勝手のいいドロワーメニューのjQueryプラグイン「Slidebars」!です。

横からスライドするドロワーメニューのjQuery、JS、CSS3のプラグインまとめ!でも紹介した個人的に一番使い勝手のいいドロワーメニューのjQueryプラグイン「Slidebars」を紹介します。

使い勝手のいいドロワーメニューのjQueryプラグイン「Slidebars」!

Slidebars

slidebars

 

jQueryプラグイン「Slidebars」をダウンロードしてみよう!

Slidebarsのサイトの「Download」のボタンをクリックしてダウンロードします。

 

jQueryプラグイン「Slidebars」の使い方

slidebars.cssをhead内に読み込みます。

 

jQuery本体とslidebars.jsを/bodyの手前に読み込みます。

 

その下に下記のスクリプトを記述します。

 

html部分を記述します。

メインのコンテンツにsb-siteというidを付けます。
開閉ボタンにはsb-toggle-leftというクラスを付けます。
サイドのコンテンツにはsb-slidebarとsb-leftというクラスを付けます。
右からの場合はそれぞれleftをrightに変更します。

 

プラグインを使わないスキルを身につけたい人のためのjQueryテクニカルノート
プラグインを使わないスキルを身につけたい人のためのjQueryテクニカルノート

 

いかがでしたか。ドロワーメニューを導入する際に使ってみてはどうでしょうか。
以上で使い勝手のいいドロワーメニューのjQueryプラグイン「Slidebars」!でした。

topへ戻る