jquery人们问题导航菜单及显示隐藏层

用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" >nav1</a>
<a href="#" id="nav2" title="nav" >nav2</a>
<a href="#" id="nav3" title="nav" >nav3</a>
<a href="#" id="nav4" title="nav" >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>

时间: 2016-03-18

jquery人们问题导航菜单及显示隐藏层的相关文章

用jQuery实现一些导航条切换,显示隐藏的实例代码_jquery

代码如下: 复制代码 代码如下: <!DOCTYPE html><html><head>    <meta charset="utf-8">    <title>导航条在项目中的应用</title>    <script language="javascript" type="text/javascript" src="Jscript/jquery-1.4.2

jQuery三级下拉列表导航菜单代码分享_jquery

本文实例讲述了jQuery三级下拉列表导航菜单.分享给大家供大家参考.具体如下: jQuery三级下拉列表导航菜单基于jquery-1.8.3.min.js,可无限极分类,可智能判断是否有下级菜单,鼠标经过上次菜单显示下级菜单. 运行效果图:             -------------------查看效果------------------- 小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式. 为大家分享的jQuery三级下拉列表导航菜单代码如下 <head> <meta

请问点击导航菜单后显示的结果也是这个页面显示

问题描述 请问点击导航菜单后显示的结果也是这个页面显示的,此页面是怎么样做的,就像是此网站,点击上面的菜单而内容在下面显示出来,上面的菜单标题不变的, 解决方案 哈哈..这其实多个不同的页面.只是每个页面都有同样的导航菜单显示在顶部的结果...楼主被忽悠了.如果要实现楼主所说的那种效果.第一种办法可以用一个页面专门放导航条.之后使用frameset和frame标签.让页面显示在框架顶部.再把框架的边框隐藏掉.让它看起来像是一个整体的页面.然后将顶部页面的所有超链接的target属性改为下面框架的

JQuery自适应窗口大小导航菜单附源码下载_jquery

效果图如下: 查看演示  源码下载 html代码: <h1>jQuery / Zepto响应式菜单 PgwMenu 演示</h1> <p class="dowebok-explain">请缩小/放大浏览器窗口宽度查看效果</p> <h2>深色样式(默认)</h2> <ul class="pgwMenu"> <li><a class="selected&qu

jquery专业的导航菜单特效代码分享_jquery

本文实例讲述了jquery专业的下拉菜单特效.分享给大家供大家参考.具体如下: 这是一款基于jquery实现的专业下拉菜单特效,蓝色风格的下拉菜单非常经典,网站是否有一个具有吸引力的导航会影响到用户停留时间的长久,就像小编编辑的文章内容影响亲们的访问时间长久一样.大家要学会如何建立一个属于自己网站风格的导航菜单. 运行效果图:-------------------查看效果 下载源码------------------- 小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式. 关键代码: stu

jQuery垂直多级导航菜单代码分享_jquery

这是一款基于jquery实现的垂直导航菜单特效代码,总共有三级,实现效果简单大方,最后一级还可以进行图片展示说明,是一款非常实用的导航菜单特效源码. 效果演示 源码下载 为大家分享的jQuery垂直多级导航菜单代码如下 <head> <title>jQuery垂直多级导航菜单代码</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

jquery动感漂浮导航菜单代码分享_jquery

这是一款基于jquery实现动感漂浮导航菜单的特效代码,菜单可以上下浮动,动感十足,为自己的网站增加了活力,是一款非常实用的导航菜单特效源码. 运行效果图: 点击下载源码 为大家分享的jquery动感漂浮导航菜单代码如下 <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>jQuery Floating Menu<

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" xml:lang="en" lang="en">

检测IE版本--&amp;amp;gt;比较IE版本--&amp;amp;gt;大于8不显示隐藏层则小于8显示隐藏层

问题描述 检测IE版本-->比较IE版本-->大于8不显示隐藏层则小于8显示隐藏层 检测IE版本-->比较IE版本-->大于8不显示隐藏层则小于8显示隐藏层 解决方案 用useragent去判断.