`
keimon
  • 浏览: 74785 次
  • 性别: Icon_minigender_2
  • 来自: 上海
社区版块
存档分类
最新评论

常见三级菜单

阅读更多



  

核心jquery代码:

$(function(){

   $('.topH li').mouseenter(function(){
      var that = $(this);
   var index = $('.topH li').index(that);
   $('.topH li').removeClass('activeLi').eq(index).addClass('activeLi');
   $('#content .neirong').hide().eq(index).show();
//   var a = $('#content .neirong').eq(index).find('li').length;
      enterLi()
   })
  
   function enterLi(){
      $('#content .neirong:visible').find('li').hover(function(){
         var thatH = $(this);
      var $li = $('#content .neirong:visible').find('li');
      var indexH = $li.index(thatH);
      $li.find('h3').eq(indexH).addClass('activeH4');
      $li.find('.one').eq(indexH).addClass('activeDiv');
      },function(){
         var thatH = $(this);
      var $li = $('#content .neirong:visible').find('li');
      $li.find('h3').removeClass('activeH4');
   $li.find('.one').removeClass('activeDiv');
   })
   }
  
   enterLi()
})

  • 大小: 16.2 KB
  • 大小: 16.2 KB
0
1
分享到:
评论

相关推荐

    三级菜单联动实现菜单联动效果

    "三级菜单联动"是指当用户选择一级菜单时,会自动触发二级菜单的显示,进一步选择二级菜单时,会展示对应的三级菜单。这种效果在导航、设置选项或者复杂功能菜单中尤为常见。 实现三级菜单联动,通常涉及以下关键...

    Bootstrap左侧下拉三级菜单导航

    在Bootstrap中,构建一个左侧下拉三级菜单导航是常见的需求,尤其对于那些具有复杂层级结构的网站。这种导航可以帮助用户轻松地浏览和访问网站的各个部分。 首先,让我们了解下Bootstrap菜单的基本构造。Bootstrap...

    纯html+css制作三级下拉菜单

    接下来,对于三级菜单,原理与二级菜单相同,但嵌套更深。在一级菜单项的子`<ul>`中,再嵌套一层`<ul>`来创建三级菜单。当鼠标悬停在二级菜单项上时,三级菜单会出现。这同样通过CSS的`:hover`选择器和`display`属性...

    三级导航菜单

    <li><a href="#">三级菜单1-1-1</a></li> <li><a href="#">三级菜单1-1-2</a></li> <li><a href="#">二级菜单1-2</a></li> <!-- 其他一级菜单项 --> ``` 这段代码定义了一个包含多级子菜单的无序列表,...

    三级菜单三级菜单x下载

    三级菜单的实现方式多种多样,常见的有HTML、CSS和JavaScript技术。HTML用于创建基本的结构,CSS用于样式控制和布局,JavaScript则用于交互效果,如动态展开和关闭菜单项。在ASP(Active Server Pages)环境中,...

    jsp结合js实现三级菜单联动.pdf

    在 Web 开发中,三级菜单联动是非常常见的需求,例如在选择学校、专业、班级时,需要三级菜单联动来选择正确的信息。下面我们将介绍如何使用 JSP 结合 JS 实现三级菜单联动。 JSP 介绍 JSP(Java Server Pages)是...

    三级菜单树

    在IT领域,三级菜单树是一种常见的用户界面设计模式,尤其在网页和应用程序中广泛使用。它主要用于组织大量的信息,提供清晰的导航结构,使用户能够高效地浏览和访问内容。以下是对三级菜单及其相关知识点的详细说明...

    漂亮三级菜单 导航菜单 菜单

    "漂亮三级菜单 导航菜单 菜单"这个标题暗示我们关注的是一个多级菜单系统,它可能具有良好的视觉吸引力和易用性,适用于组织复杂的网站结构。这种菜单通常包括主菜单、次级菜单以及更深层次的子菜单,帮助用户方便地...

    Nfine三级菜单.zip

    在这个"NFine三级菜单.zip"压缩包中,包含了一些关键文件,用于实现一个三级滑动菜单功能,这在多层级导航中非常常见,例如在大型网站或复杂的后台管理系统中。 首先,我们来看看`framework-theme.css`这个文件。这...

    三级树菜单样式

    例如,第一级菜单可能有较大的字体和背景色,第二级菜单可能有较小的字体和不同的颜色,第三级菜单则可能更加低调,只在鼠标悬停时才显示。此外,CSS还需要处理展开和折叠的状态,比如使用伪类`:hover`和`:active`来...

    三级菜单样式

    本项目主要关注的是"三级菜单样式"的实现,这是在网站导航中常见的一个功能,尤其适用于内容丰富的大型网站。通过结合CSS3、HTML5和JavaScript的技术,我们可以创建出具有动态效果的三级菜单,使用户在浏览时能更...

    web页面三级联动菜单

    三级联动菜单通常指的是一个包含主菜单、子菜单和孙菜单的多层次下拉菜单结构,用户在选择一级菜单时,会触发二级子菜单的显示,继续选择二级菜单则会展示三级子菜单。这种设计模式极大地节省了页面空间,同时也提升...

    菜单三级选择

    三级菜单设计的核心在于联动性,即用户在一级菜单中选择一项后,二级菜单会动态更新,展示与所选一级菜单相关的选项;同样,二级菜单的选择会影响三级菜单的内容。这样的设计能够帮助用户快速定位到他们需要的具体...

    三级dropdown弹出菜单

    三级菜单1-2-1 三级菜单1-2-2 <!-- 其他主菜单项 --> ``` CSS通常用来设置菜单的样式,包括颜色、字体、边距、过渡效果等,以及处理子菜单的显示和隐藏。例如: ```css .dropdown { position: ...

    基于数据库的三级菜单实现

    在Web开发中,三级菜单是非常常见的功能,三级菜单的实现可以使用静态的方式,也可以使用动态的方式,基于数据库的三级菜单实现是指使用数据库来存储三级菜单的数据,并使用服务器端语言来实现三级菜单的动态生成。...

    WPF 二三级菜单选复选框

    在Windows Presentation Foundation(WPF)中,创建带有二级和三级菜单的复选框是一个常见的UI设计需求,尤其在构建复杂的用户界面时。WPF提供了一种灵活的方式来实现这样的功能,结合TreeView控件和...

    实用框架三级菜单

    首先,三级菜单是一种常见的导航模式,尤其适用于内容层级丰富、分类繁多的网站或应用。它通常由主菜单、次级菜单和第三级子菜单组成,让用户能够通过逐级展开的方式找到所需信息或功能。例如,在电商平台上,用户...

    javascript 无刷新三级菜单

    根据给定的文件信息,我们可以深入探讨“javascript无刷新三级菜单”的相关知识点,包括其实现原理、技术栈的选择以及代码的具体解析。 ### 一、无刷新三级菜单的实现原理 无刷新菜单主要通过异步JavaScript和XML...

    动态加载三级菜单

    对于"动态加载三级菜单"这个主题,我们主要讨论的是如何在网页或应用程序中实现一个可以按需加载的多层次导航菜单。 首先,我们需要理解菜单的层级结构。三级菜单意味着主菜单下有子菜单,子菜单下还有更深层次的...

Global site tag (gtag.js) - Google Analytics