<!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. Scala-基础-变量与常量

    import junit.framework.TestCase import org.junit.Test //变量 //var 代表变量 //val 代表常量 //关键字 class,extends ...

  2. [ USACO 2018 OPEN ] Out of Sorts (Silver)

    \(\\\) \(Description\) 运行以下代码对一长为\(N\)的数列\(A\)排序,不保证数列元素互异: cnt = 0 sorted = false while (not sorted ...

  3. 电源管理POWER_SUPPLY_PROP_CAPACITY_LEVEL

    电量计节点中有capacity_level 节点,这个是反应当前电池电流高低水平的参数. 分为critical low full normal 一般是由fg的芯片来判断,通过IIC读取,具体判断可参考 ...

  4. PowerDesigner16逆向工程生成PDM列注释(My Sql5.0模版)

    一.编辑当前DataBase 选择DataBase——>edit Current DBMS...弹出如下对话框:  如上图,先解释一下: 根据红颜色框从上往下解释一下. 第一个红框是对应的修改的 ...

  5. eclipse中代码整体左右移动的方法

    1.向左:将要移动的代码选中,然后按TAB键2.向右:将要移动的代码选中,然后按shift+tab键 kettas:  2009-8-21

  6. Linux之FTP/TFTP(vsftp、vsftpd) HTTP(httpd、apache) DHCP(dhcpd)

    FTP/TFTP(vsftp.vsftpd): FTP是File Transfer Protocol(文件传输协议)而中文简称为"文传协议".用于Internet上的控制文件的双向 ...

  7. python 列出出当前目录及所有子目录下的文件

    [root@web1 test]# cat walk.py #!/usr/bin/python # -*- coding: UTF-8 -*- import os for root, dirs, fi ...

  8. Charles 下载-破解-安装-配置

    我当前使用版本为V4.2.7 最新版本下载地址 Charles 在线破解工具 下载完之后,先进行安装,安装完之后,根据破解链接中的步骤来就ok了. 比较费劲配置在下面,不过跟着一步步来就一定能好的 点 ...

  9. 8 pandas模块，多层索引

      1 创建多层索引     1)隐式构造         最常见的方法是给DataFrame构造函数的index参数传递两个或更多的数组           · Series也可以创建多层索引    ...

  10. selenium动作链

    简介 一般来说我们与页面的交互可以使用Webelement的方法来进行点击等操作. 但是,有时候我们需要一些更复杂的动作,类似于拖动,双击,长按等等. 这时候就需要用到我们的Action Chains ...