2012-04-17 17 views
0

私は2つのメニューを持っています。 1つはヘッダーにあります。もう1つはページの左側のサイドバーに表示されます。2つのメニューでjQueryを使ってメニュー項目を強調表示

HEADER

<div id="topmenu"> 
    <ul> 
     <li><a href="/">Home</a></li> 
     <li><a href="/baseball">Baseball</a></li> 
     <li><a href="/football">Football</a></li> 
    </ul> 
</div> 
BASEBALLページに

<div id="leftmenu"> 
    <ul id="teams"> 
     <li><a href="/yankees">Yankees</a></li><br /> 
     <li><a href="/redsox">Red Sox</a></li><br /> 
     <li><a href="/cubs">Cubs</a></li><br /> 
    </ul> 
</div> 

は、ここで私は#topmenuを強調表示する方法(長い物語が、それは動作します)です:

$(function(){ 

    var url = window.location.pathname, 
     urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); 
     $('#topmenu li a').each(function(){ 

      if(urlRegExp.test(this.href.replace(/\/$/,''))){ 
       $(this).addClass('blue'); 
      } 
     }); 
    }); 

挑戦は# leftmenu:

1 - 私はjQueryの

2使用-li-それぞれのコンテンツを表示/非表示しています - 最初にページをロードは、#topmenu項目がhiglightedされ、私も#の最初の項目をしたいです左メニューもハイライト表示されます。言い換えれば、#topmenu項目が選択されているときと、最初の#leftmenu項目が選択されているときに同じページが表示されます。これをどうすればいいのですか?

それが助け場合は、野球のページがそうのような設定です:

Baseball.php

<div id="header"> 
</div> 

<div id="main"> 
<?php include('baseball_stuff.php'); ?> 
</div> 

<div id="footer"> 
</div> 

その後、私はbaseball_stuff.phpに#topmenuとのリンクにbaseball.phpへリンク#leftmenuでは、私はコンテンツを複製する必要はありません。

jsfiddle:http://jsfiddle.net/Ft8FR/

答えて

1

あなたの質問のこの部分は、私にはどんな意味がありません

私は同じ#topmenu項目を選択したときに表示されるページ、 およびときに最初にしたいです#leftmenu項目が選択されています。 をこのようにするにはどうすればよいですか?

先ほど言いましたが意味があります。だから私はこれに答えて、それがあなたが探しているものだと願っています。

私も

$('#leftmenu li:first').addClass('blue'); 
+0

感謝を強調表示する#leftmenuの最初の項目をしたいです。私はあなたの答えを受け入れた。それが私の必要なものです。 – chowwy

関連する問題