jQuery技术

用 jquery实现显示隐藏层和用jquery实现导航样式

字号+ 作者: 来源: 2014-11-16 22:49 我要评论( )

用jquery实现显示隐藏层,和用jquery实现导航样式 非常简单的几句代码,免去了用js写一大串的垃圾代码。

用jquery实现显示隐藏层,和用jquery实现导航样式
非常简单的几句代码,免去了用js写一大串的垃圾代码。

//下面是导航

样式的

$("a[title='nav']").click(function(){
           for(i=0;i<$("a[title='nav']").size();i++)
            {
                if($(this).attr("id")!

=$("a[title='nav']").eq(i).attr("id"))
                   $("a[title='nav']").eq(i).removeClass("hover");
                else
                    $("a

[title='nav']").eq(i).addClass("hover");
            }
    });
<a href="#" id="nav1" title="nav" class="hover" onfocus="this.blur();">nav1</a>
<a 

href="#" id="nav2" title="nav" onfocus="this.blur();">nav2</a>
<a href="#" id="nav3" title="nav" onfocus="this.blur();">nav3</a>
<a href="#" 

id="nav4" title="nav" onfocus="this.blur();">nav4</a>
//下面是收起和打开的样式
$(".Thand").click(function(){            $(this).next().css("display",$(this).next

().css("display")=="block" ? "none":"block");
    });
 <h2 class="Thand"><span>公司介绍</span><a href="#">open</a></h2>
    <div 

class="infobox">
        <dl>
            <dt><img src="../images/index_bg1.gif" name="logo"  id="logo" width="300"/></dt>

<dd>
            公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息
          公司介绍信息公司介绍信息公司

介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息
            公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍

信息公司介绍信息公司介绍信息
            公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息
         公司介绍信息

公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息公司介绍信息
            </dd>
       </dl>
   </div>

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • Thinkphp 结合Jquery Ajax技术实现无刷新查询

    Thinkphp 结合Jquery Ajax技术实现无刷新查询

    2016-01-15 13:09

  • 关于Ajax ,jQuery以及jQuery Ajax 编程 (二)

    关于Ajax ,jQuery以及jQuery Ajax 编程 (二)

    2015-11-20 18:00

  • jQuery学习之jQuery Ajax用法详解

    jQuery学习之jQuery Ajax用法详解

    2015-11-14 18:43

  • JQuery 与ajax的技术交互效果

    JQuery 与ajax的技术交互效果

    2015-11-14 11:45

网友点评
n