<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title>制作子菜单</title>

    <script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script>

    <script type="text/javascript">

        $(function(){

            $("h2").click(function(){

                $(this).next("ul").css("display","block").addClass("nav");

                $($("li")[0]).css("background-color","#ccc");

            });

        })

    </script>

    <style type="text/css">

        .nav li{

            font-size:14px;

            font-weight:bold;

            line-height: 24px;

        }

    </style>

</head>

<body>

<h2>新手指南</h2>

<ul style='display:none'>

    <li><a href="#">会员注册</a></li>

    <li><a href="#">订阅更新</a></li>

    <li><a href="#">用户协议</a></li>

    <li><a href="#">常见问题</a></li>

</ul>

</body>

</html>

制作点击显示二级菜单效果.html

jQuery - 制作点击显示二级菜单效果的更多相关文章

  1. javascript 特效实现(3)—— 鼠标滑过显示二级菜单效果

    1. 关键代码:使用 switch 或 if 判断语句,改变对应的二级菜单显示方式为 block 或 none function selectTabMenu(i){ switch(i){ case 7 ...

  2. jQuery制作右侧边垂直二级导航菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. jquery制作弹出层带遮罩效果，点击阴影部分层消失

    jquery制作弹出层带遮罩效果,点击阴影部分层消失. 整体还是比较简单的. HTML代码很简单 <a href="#" class="big-link" ...

  4. 推荐10个 CSS3 制作的创意下拉菜单效果

    下拉菜单是一个很常见的效果,在网站设计中被广泛使用.通过使用下拉菜单,设计者不仅可以在网站设计中营造出色的视觉吸引力,但也可以为网站提供了一个有效的导航方案.使用 HTML5 和 CSS3 可以更容易 ...

  5. js点击出现二级菜单，点击二级菜单主菜单换成二级菜单

    点击出现二级菜单 *{ margin:0px auto; padding:0px; } .yiji{ width:200px; height:40px; background-color:red; c ...

  6. 鼠标经过显示二级菜单的js特效

    本文章来给大家推荐一个不错的鼠标经过显示二级菜单js特效效果,有需要了解的朋友可以参考一下 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 T ...

  7. 基于jquery鼠标点击图片翻开切换效果

    基于jquery鼠标点击图片翻开切换效果是一款基于jQuery+CSS3实现的点击图片切换特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class=&quo ...

  8. Selenium操作示例——鼠标悬停显示二级菜单，再点击二级菜单或下拉列表

    这两天在玩python中selenium,遇到一个问题,就是鼠标移动到页面中某按钮或菜单,自动弹出二级菜单或下拉菜单,再自动点击其中的二级菜单或下拉列表. 首先,手工操作:打开母校的主页 http:/ ...

  9. jquery垂直展开折叠手风琴二级菜单

    摘要:jquery实现垂直展开二级菜单 最近新开发一个简单项目,用到左侧两级的菜单.找找了手头的文件,竟然没有现成的代码,算了,去网上找找整理下吧. 注:jquery-1.8.3.min.js需要下载 ...

随机推荐

  1. Android之Glide获取图片Path和Glide获取图片Bitmap

    今天主要研究了Glide获取图片Path.Bitmap用法,相信也困扰了大家很久,我在网上也找了很久,基本没有,后来研究了下,也参考了下api文档,总结了以下几个方式: 1. 获取Bitmap: 1) ...

  2. VC socket api使用引入

    1.在创建项目时勾上windows socket api的使用 2.头文件 #pragma  comment(lib,"WS2_32.lib") 3.初始化 WSADATA dat ...

  3. win32之bitmap篇

    先讲一下LoadBitmap的用法,代码如下: PAINTSTRUCT ps; HDC hdc = BeginPaint(hwnd,&ps); HDC hMemDC = CreateCompa ...

  4. 3--Java NIO基础1

    一.NIO概述 1. BIO带来的挑战 BIO即堵塞式I/O,数据在写入或读取时都有可能堵塞,一旦有堵塞,线程将失去CPU的使用权,性能较差. 2. NIO工作机制 Java NIO由Channel. ...

  5. linux shell & bash

    shell & bash shell指允许用户通过文本操作计算机的程序. interactive shell:从是否通过标准输入输出与用户进行交互的角度分为交互式shell(interacti ...

  6. python网络编程调用recv函数完整接收数据的三种方法

    最近在使用python进行网络编程开发一个通用的tcpclient测试小工具.在使用socket进行网络编程中,如何判定对端发送一条报文是否接收完成,是进行socket网络开发必须要考虑的一个问题.这 ...

  7. css学习笔记---盒模型，布局

    1.外边距叠加 当一个元素出现在另一个元素上面时第一个元素的底边距与第二个元素的上边距发生叠加,元素被包含时也有可能会发生叠加(如果没有内边距和边框),如果一个空元素没有内边距和边框本身也会发生上下边 ...

  8. abstract class和interface 抽象类与接口类的区别

    抽象类与类型定义相关: 接口类与行为规范相关: 接口类不是类型. 抽象类:是不完整的类,函数实现未定义:可以继承,不可以实例化. 接口类:接口类不是类:是类间交互的规范:不能继承.不能实例化,只能实现 ...

  9. mvc EF 出现异常, 能提示出那个字段出现问题

    } catch (DbEntityValidationException ex) { message = "添加异常"; desc = " {" + ex.Me ...

  10. Python 之读取大文件readline与readlines的差别

    import time def get_all_lines(filename): start_time = time.time() try: f = open(filename, 'rb') exce ...