如何点击导航条的链接,去到另外一个网站,那么这时导航条的导航背景颜色就会改变。
如:
现在是处于相册阶段,那么如果我点音乐的话,这个背景就会停在音乐的那个页面上。

解决方案 »

  1.   

    可以通过JS来获取你的链接然后根据链接来判断哪个需要选中效果class="select"。给个大概思路var url=document.location.href;
    var urlist="";
    var tabi=1;
    var urlvalue="";
    url=url.replace("http://","");
    urlist=url.split('/');
    urlvalue=urlist[1];
    if(urlvalue.indexOf('photo')==0)
    {
    tabi=1;
    }
    else
    {
    tabi=1;//默认
    }
    document.getElementById("photo").className="select"; 
      

  2.   

    本实例是通过ID来修改其class的。
      

  3.   

    如下是通过jquery实现的,
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <script src="jquery-1.8.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(function(){
    $("[class^=sty]").click(function(){
    $("[class^=sty]").removeClass("sty1").addClass("sty2");
    $(this).removeClass("sty2").addClass("sty1");
    })
    })
    </script>
    <style>
    .sty1{
    background-color:red;
    }
    .sty2{
    background-color:blue;
    }
    </style>
    </head>
    <body>
    <input type="button" id="btn1" value="11" class="sty1"/>
    <input type="button" id="btn2" value="22" class="sty2"/>
    <input type="button" id="btn3" value="22" class="sty2"/>
    </body>
    </html>
      

  4.   

    传个navId到后台呗~前台根据navId选择相应导航菜单
      

  5.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <script src="jquery-1.8.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    /*
    $(function(){
    $("[class^=sty]").click(function(){
    $("[class^=sty]").removeClass("sty1").addClass("sty2");
    $(this).removeClass("sty2").addClass("sty1");
    })
    })
    */
    function clickBtn(o){
    $("[class^=sty]").removeClass("sty1").addClass("sty2");
    $(o).removeClass("sty2").addClass("sty1");
    window.open("http://www.baidu.com")
    }
    </script>
    <style>
    .sty1{
    background-color:red;
    }
    .sty2{
    background-color:blue;
    }
    </style>
    </head>
    <body>
    <input type="button" id="btn1" value="11" onclick="clickBtn(this)" class="sty1"/>
    <input type="button" id="btn2" value="22" onclick="clickBtn(this)" class="sty2"/>
    <input type="button" id="btn3" value="22" onclick="clickBtn(this)" class="sty2"/>
    </body>
    </html>这样,单击打开百度,同时样式切换?
      

  6.   

    我想实现的是:当你点击photo.html页面的时候,背景图是在相册上。
    如果你点击music.html页面的时候,这个背景图片是在音乐上。
      

  7.   


    假设 按钮的class与当前的地址存在对应关系即:
    www.***.com/photo.html....
    <ul>
        <li>
         <a class="music">音乐</a>
         <a class="photo">相册</a>
         <a class="blog">日志</a>
        </li>
    </ul>
    .....var Turl=location.href;
    var patt = /\/(.*?).html/g
    var TmpClass="";
    while ((result = patt.exec(str)) != null)  {
      TmpClass='.'+result[1];
     }
    $(TmpClass).css('background-color','red'); //为对应的类设置样式.