グローバルメニューにサブメニューをとりつける

どうも。なでしこ決勝へ らいぱちです。
思い切ってブログのデザインやUIを変えてみようと奮闘中なんで、
思いっきりデザインが崩れています。
早く整えたい。。。
きょうは悪戦苦闘しながらやっている
「グローバルメニューにサブメニューを設置する」方法の備忘録的メモです。
グローバルメニューには「カテゴリー」という項目だけを残し
「カテゴリー」ボタンにマウスオーバーしたら
各カテゴリーにリンクできるサブメニューを設置することにしようと思います。
手順としては、
1、HTMLのグローバルメニューのリストタグを階層構造にする。
2、CSSでデザイン・レイアウトを作成。
3、headタグ内にjQueryのコードを書いて動かす。
こんな感じで試合開始です。


まずはとにもかくにもグローバルメニューを設置します。
くわしい手順については「グローバルメニューを設置する」で。
グローバルメニューの項目を「トップページ」や「サイトマップ」とか
必要最低限の項目だけにしておけば、
サブメニューなんて必要なかったのですが、
各カテゴリーをグローバルメニューにいれようとしたら
横幅が足りなくなってしまいました。
そこでグローバルメニューには「カテゴリー」という項目だけを残し
「カテゴリー」部分にマウスオーバーしたら
各カテゴリーにリンクできるサブメニューを設置することにします。

この記事が気に入ったら
いいね!しよう

Twitter で

PAGE TOP