zoukankan      html  css  js  c++  java
  • 导航栏动态高亮显示

     <ul id="navcla">
                    <li style="border: 0"><a href="AboutOurs.aspx?id=1">关于我们</a></li>
                    <li><a href="Coterie.aspx">同行入口</a></li>
                    <li><a href="Travel.aspx">度假旅游</a></li>
                    <li><a href="DiscountFlight.aspx">公司简介</a></li>
                    <li><a href="#">酒店预订</a></li>
                    <li><a href="InternationalFlight.aspx">国际机票</a></li>
                    <li><a href="FlightSearch.aspx">国内机票</a></li>
                    <li><a href="Index.aspx">首 页</a></li>
                </ul>




    <script type="text/javascript">
     window.onload=function menuFix() {
     var strUrl,strHref;
     var Navs=document.getElementById("navcla").getElementsByTagName("a");     //navcla是ul 的id                    
        // 如果链接没有参数,或者URL链接中不存在我们要获取的参数,则返回数组中的序号
            strUrl=location.href.substring(location.href.lastIndexOf("/")+1);//取得URL页面名称
            for (var i = 0; i < Navs.length; i++) {            
                strHref=Navs[i].getAttribute("href").substring(Navs[i].getAttribute("href").lastIndexOf('/')+1);    ///在IE6,IE7中strHref获得的是全路径,而在IE8和ff中获得的是页面名称,为了兼容,需要将它的字符串进行拆分/
               if(strUrl==strHref){
                    //高亮当前菜单
                 Navs[i].className = "current"        
                }
                else{
                    Navs[i].onmouseover=function() {
                      this.className+=(this.className.length>0? " ": "") + "over";
                      }
                 Navs[i].onmouseout=function() {
                 this.className=this.className.replace(new RegExp("( ?|^)over\\b"),"");
           }  
         }
      }
    }
    </script>
  • 相关阅读:
    【2021-08-09】问题还需一点一点去改正
    【2021-08-08】连岳摘抄
    【2021-08-07】请教帖
    21春助教总结
    实践总结+技术博客评分
    来吧 ,来吧 自己搭建一个erp 系统
    博客索引
    「CCNU21暑期第六次周赛」
    「CCNU21暑期第五次周赛」
    「图论」连通性问题
  • 原文地址:https://www.cnblogs.com/wanglinglong/p/1624771.html
Copyright © 2011-2022 走看看