カスタマイズ事例 ハンバーガーボタンとドロワーメニュー
このサイトのヘッダーにハンバーガーボタンとドロワーメニューを実装しました。
パソコンの場合は左からスライドして出てきます。
ハンバーガーボタンとドロワーメニュー (パソコン)
スマホでは上からスライドして下りてきます。
ハンバーガーボタンとドロワーメニュー (スマホ)
2022.4.27 ドロワーメニューのデザインに手を加えました
- アイコンを大きくして見やすいメニューにしました。
- マウスホバー時のアイコンアニメーションを設定しました。(アイコンごとに異なるアニメーションを設定してみました)
メニューの位置に Hamburger Menu を追加してこのメニューを表示していますので、お客様の側でメニューの追加・変更を容易に行うことができます。
MEMO
今回は addClass / removeClass を使用。他に、slideToggle を使う方法、fadeIn / fadeOut を使う方法などもある。
アイキャッチ画像付きドロワーメニュー
リンク先の固定ページに設定されているアイキャッチ画像を表示するメニューも制作可能です。

WordPress / Lightning
のカスタマイズを承ります
ベクトル公式テクニカルパートナー
があなたをお手伝いします
弊社 (魚沼情報サービス) ではこのサイトで紹介しているようなカスタマイズのお仕事をお引き受けしています。
デザイン・仕様について、お客様のご要望に合わせてカスタマイズいたします。
無料で費用見積りいたしますので、お気軽にお問い合わせください。