zoukankan      html  css  js  c++  java
  • 导航高亮

    ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    最新版,主导航高亮,子导航高亮!

    (function() {
      $(function(){
      //开始。。。。。。。。。。。。。。。。。。。。。。。。。
    //导航高亮方法 var urlstr = location.href;     //获取浏览器的url var urlstatus = false;         //标记   //遍历导航div $("#menu a,#nav a").each(function() { //判断导航里面的rel和url地址是否相等 if ((urlstr + '/').indexOf($(this).attr('rel')) > -1 && $(this).attr('rel') !='') { $(this).addClass('cur'); //主菜单高亮 var menuId = $(this).attr("data-id"); if (menuId) { $("#" + menuId).addClass("cur"); $(this).addClass('on'); //子菜单高亮 urlstatus = true; //return false; //是否停止循环 } } else { $(this).removeClass('cur'); } });
    //结束。。。。。。。。。。。。。。。。。。。 }); })(jQuery);
    <div id="menu">
            <ul>
                <li><a href="link.html" id="linkOne" rel="link.html">link</a></li>
                <li><a href="link2.html" id="linkTwo" rel="link2.html">link</a>
                    <dl>
                      <dd><a href="nav1.html" rel="nav1.html" data-id="linkTwo">子菜单1</a></dd>
                      <dd><a href="nav2.html" rel="nav2.html"  data-id="linkTwo">子菜单2</a></dd>
                  </dl>
                </li>
                <li><a href="link3.html" id="linkThree" rel="link3.html">link</a></li>
            </ul>
        </div>
    
        <div id="nav">
            <ul>
                <li>
                    <a href="nav1.html" rel="nav1.html" data-id="linkTwo">子菜单1</a>
                    <a href="nav2.html" rel="nav2.html" data-id="linkTwo">子菜单2</a>
                </li>
            </ul>
        </div>

    ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    http://www.cnblogs.com/Dtscal/p/acv.html

    if(nowUrl == ctx+"/center/personal/index.xhtml" || nowUrl == ctx+"/center/school/index.xhtml" || nowUrl == ctx+"/center/company/index.xhtml" ){
    				//首页高亮
    				$("#indexMenu").addClass("hover1");
    			}else{
    				$("a").each(function(){
    					var getUrl = $(this).attr("href");
    					if(getUrl == nowUrl ){
    						var menuId= $(this).attr("data-fatherId");
    						if(menuId){
    							$("#"+menuId).addClass("hover1");
    							return false;
    						}
    						
    					}
    				})
    			}

    var urlstr = location.href;    //获取浏览器的url
     var urlstatus=false;        //标记
     //遍历导航div
     $("#menu a").each(function () {
    //判断导航里面的rel和url地址是否相等
      if ((urlstr + '/').indexOf($(this).attr('rel')) > -1&&$(this).attr('rel')!='') {
       $(this).addClass('cur'); urlstatus = true;
      } else {
       $(this).removeClass('cur');
      }
     });
    //当前样式保持
     if (!urlstatus) {$("#menu a").eq(0).addClass('cur'); }

    明天来完善



  • 相关阅读:
    POJ2960 S-Nim
    HDU1850 Being a Good Boy in Spring Festival
    描述性统计-1
    基础-1
    .Net程序调试
    家装设计
    ACDSee技巧
    Timeline Maker 用法小结
    Windows 7 操作系统核心文件
    艺术字的操作
  • 原文地址:https://www.cnblogs.com/hupan508/p/5440466.html
Copyright © 2011-2022 走看看