1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <style type="text/css">
  7. ul{
  8. list-style: none;
  9. float: left;
  10. }
  11. li{
  12. display: none;
  13. }
  14. </style>
  15. <script type="text/javascript">
  16. function disp(){
  17. for(var i = 0; i<3; i++){
  18. document.getElementsByClassName('sss')[i].style.display='block';
  19. }
  20. }
  21. function out(){
  22. for(var i = 0; i<3; i++){
  23. document.getElementsByClassName('sss')[i].style.display='none';
  24. }
  25. }
  26. </script>
  27. </head>
  28. <body>
  29. <ul onmouseover="disp()" onmouseout="out()"> 手机数码
  30. <li class="sss">iPhone</li>
  31. <li class="sss">SAMSUNG</li>
  32. <li class="sss">SAMSUNG</li>
  33. </ul>
  34. </body>
  35. </html>
 
方法二
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <style type="text/css">
  7. li:hover #b{
  8. display: block;
  9. }
  10. #b{
  11. display: none;
  12. }
  13. </style>
  14. </head>
  15. <body>
  16. <ul>
  17. <li>sss
  18. <ul id="b">
  19. <li ></li>
  20. <li ></li>
  21. <li ></li>
  22. <li ></li>
  23. </ul>
  24. </li>
  25. </ul>
  26. </body>
  27. </html>

Html中鼠标悬停显示二级菜单的两种方法的更多相关文章

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

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

  2. 可以兼容ie6的纯CSS三级鼠标悬停显示/隐藏菜单实现

    本来在chrome上用js写的好好的三级显隐菜单,放到ie6上一测试竟然奇葩般的会瞎闪.问题原因至今没参透,可能是我每次响应事件的处理代码过长??总之我是对ie6幻灭了,去网上搜一搜能支持ie6的下拉 ...

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

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

  4. 利用来JS控制页面控件显示和隐藏有两种方法

    利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一:  1 2 document.getEle ...

  5. 【转】oracle 中随机取一条记录的两种方法

    oracle 中随机取一条记录的两种方法 V_COUNT INT:=0; V_NUM INT :=0; 1:TBL_MYTABLE 表中要有一个值连续且唯一的列FID BEGIN SELECT COU ...

  6. 在PHP代码中处理JSON 格式的字符串的两种方法:

    总结: 在PHP代码中处理JSON 格式的字符串的两种方法: 方法一: $json= '[{"id":"1","name":"\u ...

  7. HTML中禁用表单控件的两种方法readonly与disabled

    时候我们会希望表单上的控件是不可修改的,比如在修改密码的网页中,显示用户名的文本框就应该是不可修改状态的,下面与大家分享下禁用表中控件的两种方法 在网页的制作过程中,我们会经常使用到表单.但是有时候我 ...

  8. Android中使用Gson解析JSON数据的两种方法

    Json是一种类似于XML的通用数据交换格式,具有比XML更高的传输效率;本文将介绍两种方法解析JSON数据,需要的朋友可以参考下   Json是一种类似于XML的通用数据交换格式,具有比XML更高的 ...

  9. AutoCAD.NET二次开发:创建自定义菜单的两种方法比较

    目前我已经掌握的创建CAD菜单方法有两种: COM方式: http://www.cnblogs.com/bomb12138/p/3607929.html CUI方式: http://www.cnblo ...

随机推荐

  1. Java基础-重写方法

    一般我们需要在新类上重写,两个类的实现: class Animal{ public void move(){ System.out.println("动物可以移动"); } } c ...

  2. Python操作RabbitMQ

    RabbitMQ介绍 RabbitMQ是一个由erlang开发的AMQP(Advanced Message Queue )的开源实现的产品,RabbitMQ是一个消息代理,从“生产者”接收消息并传递消 ...

  3. socket编程基础

    socket编程 什么是socket 定义 socket通常也称作套接字,用于描述IP地址和端口,是一个通信链的句柄,应用程序通常通过套接字向网络发出请求或者应答网络请求. socket起源于Unix ...

  4. TypeScript Function(函数)

    在JavaScript中,函数是构成任何应用程序的基础块.通过函数,你得以实现建立抽象层.模仿类.信息隐藏和模块化.在TypeScript中,虽然已经存在类和模块化,但是函数依旧在如何去"处 ...

  5. JQuery事件之鼠标事件

    鼠标事件是在用户移动鼠标光标或者使用任意鼠标键点击时触发的. ():click事件:click事件于用户在元素敲击鼠标左键,并在相同元素上松开左键时触发. $('p').click(function( ...

  6. sphinx 配置文件全解析

    sphinx的配置文件是在配置的时候最容易出错的了: 我们先要明白几个概念: source:数据源,数据是从什么地方来的. index:索引,当有数据源之后,从数据源处构建索引.索引实际上就是相当于一 ...

  7. 使用Nominatim进行openstreetmap地址搜索/解析

    Nominatim(来自拉丁语,意思是“名称”)是一个可以按名称和地址来搜索OSM中的数据,并生成OSM点的合成地址的工具(反向地理编码).可用在http://nominatim.openstreet ...

  8. NodeJs框架

    Node.js非常适用于Web开发,但是现在无论是一个网站,还是Web App都已经成为包括很多不同部分,如前端.数据库.业务模块.功能模块等等的大型项目,使用Node.js从零开始进行Web开发,也 ...

  9. Windows下安装MongoDB

    项目当中用到MongoDB最为NoSQL数据库,运行的平台为 Windows Server 2008,下面是MongoDB的安装过程笔记: 1.下载软件 官方下载地址:http://www.mongo ...

  10. 为何Apache下.htaccess不起作用,Linux、Windows详解

    可能出现下面这三种的错误可能性: 第一种:启用 rewrite 和 .htaccess 设置 rewrite设置:找到apache的配置文件httpd.conf文件,找到:#LoadModule re ...