jquery活动菜单

时间:2010-08-04 20:55:43

标签: jquery

我有一个问题,我有一个菜单,我想添加一些jquery,以便活动菜单选项卡的布局与其余选项不同,这是我的代码:

<div id="menu">
<ul>
<li><div id="start"><span>start</span></div></li>
<li><div id="menuhome"><a href="index.php?page=home"<span>home</span</a</div</li>          <li><div id="menuvoorstellingen"><a><span>voorstellingen</span></a></div></li>
<li><div id="menuwinkelwagentje"><a><span>winkelwagentje</span></a></div></li>
<li><div id="menucontact"><a><span>contact</span></a></div></li>

a标签有一个backgroundimage附加到它以表示菜单按钮,当点击按钮时我需要做什么呢?它会得到一个新的backgroundimage?

1 个答案:

答案 0 :(得分:0)

假设你的网址总是有page = [something],你的div id总是菜单[某事],试试这个:

var url = window.location.pathname  // sets a variable called url to the url path. 
                                    // Yours should be something like '/index.php?page=whatever'
                                    // You can test this by uncommenting the next line

//alert( url )                      // This should alert '/index.php?page=whatever'. 
                                    // If not, let me know
url = 'http://blah.com/index.php?page=test'
match = url.match( /page=([\w]{1,})/ )  // This is a regex match. 
                                        // It looks for the string 'page=', 
                                        // and then any word character (letter, number, underscore). 
                                        // If there's an '&', it will stop matching.    

match = match[1]    // match is actually an array. 
                    // the first one (index 0) is the entire string passed, 
                    // the second (index 1) is the actual match

$( '.active' ).removeClass( 'active' )  // in jQuery, this removes the class active 
                                        // from any thing with a class of active.
                                        // essentially this resets the page should anything be flagged as active

$( '#menu' + match ).addClass('active') // This then applies the class active to something with an id of menu + the match. 

并在css中,为.bg图像提供.active