jQueryでダイナミックメニューを作成する

Question

新しいウェブサイトを作成しています。

私たちは、ページ、ナビゲーション、コンテンツ、ヘッダなどのさまざまな部分を表すのiframeで、サイトをアップしたいと思い

しかし、私たちのナビゲーションメニューは、それに組み込まれたいくつかの「コンテキスト」を持っています。つまり、あなたが「About」セクションであればAboutのボタン/リンクが強調表示され、これがサイト内のあなたの場所であることを示します。私はその後、IDをすべてのナビゲーションメニュー項目を与えることができるようにしたい

<meta name="page" content="--page name goes here--" /> 

この（または似たような）のように、各ページにメタタグを含めます。ナビゲーションメニュー項目のidが 'page'メタタグの内容と一致すると、強調表示されたイメージを通常のものよりもむしろ表示します。

これを行うには、いくつかのコードを使用して基本的な手順を概説できますか？

Answer 1

代わりに、ページのreadyイベントハンドラでそれをしない理由をメタタグにIDを入れて：

$(document).ready(function(){ 
    $("#ID_OF_MENU_FOR_THIS_PAGE").addClass("CLASS_TO_HIGHLIGHT_CURRENT_MENU"); 
}); 

それは本当にうまく機能し、私は定期的にこれを使用しています！

Answer 2

、このjQueryのコード

を使用NAVアイテムへ

「約」=たとえば、あなたがナビゲーションメニューの5つのリンク（グローバルNAV）

を持っているあなたは、IDを追加することができると言うことになる最も簡単な方法

<script> 
    $(document).ready(function() { 
     $('about').addClass('active'); 
    }); 
</script>' 

とアクティブにCSSクラスを定義し、それはあなたがページSE上の画像を変更したい場合は、それは

（ハイライトまたはwateverのように）やりたいものは何でもしてもらいますこのビットのコードを使用することができます： $（document）.ready（function（）{ $（ 'active'）css（ 'background'、 'url（/images/tabs/account_hover.png）no-リピート0 0 '）; }）; '