html5下拉列表多行显示不出来,为什么我这个代码的效果显示不出来?我要显示的是鼠标经过选项出现下拉菜单栏!求大神提点!!!...

动画菜单

* { margin: 0; padding: 0; font-size: 14px; }

a { color: #333; text-decoration: none }

ul{ list-style: none; }

.nav {height: 30px; border-bottom: 5px solid #F60; margin-left:50px; width:600px;}

.nav li { float: left; position:relative; height:30px; width:120px }

.nav li a { display: block; height: 30px; text-align: center; line-height: 30px; width:120px; background: #efefef; margin-left: 1px; }

.subNav{ position:absolute; top:30px; left:0; width:120px; height:0; overflow:hidden}

.subNav li a{ background:#ddd }

.subNav li a:hover{ background:#efefef}

/*

window.οnlοad=function(){

var aLi=document.getElementsByTagName('li');

for(var i=0; i

aLi[i].οnmοuseοver=function(){

//鼠标经过一级菜单,二级菜单动画下拉显示出来

var This=this.getElementsByTagName('ul')[0];

clearInterval(This.time);

This.time=setInterval(function(){

This.style.height=This.offsetHeight+16+"px";

if(This.offsetHeight>=120){

clearInterval(This.time);

}

},30)

}

//鼠标离开菜单,二级菜单动画收缩起来。

aLi[i].οnmοuseοut=function(){

var This=this.getElementsByTagName('ul')[0];

clearInterval(This.time);

This.time = setInterval(function(){

This.style.height=This.offsetHeight-16+"px";

if(This.offsetHeight<=0){

clearInterval(This.time);

}

},30)

}

}

}

*/

window.οnlοad=function(){

var aLi=document.getElementsByTagName("li");

for(var i=0;i

aLi[i].οnmοuseοver=function(){

//鼠标经过一级菜单,二级菜单动画下拉显示出来

var aUl=aLi[i].getElementsByTagName("ul")[0];

aUl.style.display="block";

}

aLi[i].οnmοuseοut=function(){

//鼠标离开菜单,二级菜单动画收缩起来

var aUl=aLi[i].getElementsByTagName("ul")[0];

aUl.style.display="none";

}

}

}

一级菜单一级菜单一级菜单一级菜单一级菜单

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/522536.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

jdk 安装 linux环境

文章目录一、查看jdk是否安装&#xff1f;二、安装jdk步骤2.1. 上传jdk到系统相应目录2.2. 解压2.1. 复制jdk目录2.3. 配置环境变量2.4. 保存退出2.5. 重新加载环境变量2.6. 验证是否安装成功一、查看jdk是否安装&#xff1f; java -version如果是空的&#xff0c;说明没有安装…

nginx 一个请求发给多台机器_一个机器人可以同时为多台数控机床上下料吗?东智力衡...

机床的装卸机器人是自动装卸功能&#xff0c;代替了CNC机床的装卸中的手动完成的工件。它主要适用于大量&#xff0c;高重复性或较重的工件使用&#xff0c;并且工作环境具有高温&#xff0c;粉尘等恶劣条件。具有定位准确&#xff0c;生产质量稳定&#xff0c;机床和刀具磨损减…

Kafka精华问答 | kafka节点之间如何备份?

戳蓝字“CSDN云计算”关注我们哦&#xff01;Kafka是由Apache软件基金会开发的一个开源流处理平台&#xff0c;由Scala和Java编写。作为一种高吞吐量的分布式发布订阅消息系统&#xff0c;有着诸多特性。今天&#xff0c;就让我们一起来看看关于它的精华问答吧&#xff01;1Q&a…

阿里巴巴测试环境稳定性提升实践

摘要&#xff1a; 测试环境是研发/测试同学最常用的功能&#xff0c;稳定性直接影响到研发效率&#xff0c;那如何提升测试环境的稳定性&#xff1f;阿里巴巴应用与基础运维平台高级开发工程师张劲&#xff0c;通过阿里内部实践&#xff0c;总结了一套测试环境稳定性提升方法&a…

android中设置lmargin简书,超详细React Native实现微信好友/朋友圈分享功能-Android/iOS双平台通用...

(一)前言本文主要会涉及到以下内容:微信开发者应用申请审核安装配置微信分享库微信好友/朋友圈功能实现(二)应用申请审核首先大家需要去微信开发平台去注册账号并且创建一个移动应用。(地址:https://open.weixin.qq.com)开始创建移动应用,填写应用名称,应用名称以及中英文的信息…

【干货合集】看完这些干货,再说你因为“怕蛇”,所以学不好Python!

摘要&#xff1a; 作为编程语言界的“当红小生”&#xff0c;Python不仅能够承担起Web项目的重任&#xff0c;还能够用于写自动化脚本帮助你做很多事情&#xff0c;不仅能够用于机器学习和神经网络的研究&#xff0c;还能够用于最具有业务价值的数据分析方面&#xff0c;无论什…

python到底能干啥-Python到底可以干什么?主要应用领域

如果说挑选一门编程语言进行学习&#xff0c;你会选择哪个?当然是Python。Python是一门简单的编程语言&#xff0c;适合初学者学习&#xff0c;也是很多人都喜欢的语言&#xff0c;那么Python到底可以干什么? Python语言在学术上是非常受欢迎的&#xff0c;不是计算机专业的人…

蜕变!网易轻舟微服务这波操作,始于异构融合、源于中台!

戳蓝字“CSDN云计算”关注我们哦&#xff01;作者|刘晶晶提及中台&#xff0c;无人不知。从概念诞生于阿里到如今高居神坛之上&#xff0c;整个行业无一不在频繁建设中&#xff0c;不可否认&#xff0c;TA带来的ICT变革远远超过了字面含义。深入实践我们感受到&#xff0c;有了…

首次公开!菜鸟弹性调度系统的架构设计

摘要&#xff1a; 为什么菜鸟需要弹性调度&#xff1f; 在弹性调度出现之前&#xff0c;菜鸟整体资源使用率都处于一个比较低的水平&#xff0c;这是因为&#xff1a; 1.在线应用一般是通过单机性能压测&#xff0c;并且结合经验预估业务流量的方式来确定所需容器数量。这种方式…

springboot listener_看完这份springboot 全套面试提升宝典,面试不带怕的

简介&#xff1a;Spring Boot是由Pivotal团队提供的全新框架&#xff0c;其设计目的是用来简化新Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置&#xff0c;从而使开发人员不再需要定义样板化的配置。通过这种方式&#xff0c;Spring Boot致力于在蓬勃发…

html中下边框过渡效果,CSS3 参与背景过度的属性有哪些(transition-property语法规则及多组过渡效果实例)...

CSS3 新增了背景或元素运动过度效果属性 transition&#xff0c;其中有一个取值为过渡实体 transition-property&#xff0c;也就是设置什么参与过渡&#xff0c;有多个实体可供选择&#xff0c;如常用背景颜色(background-color)、背景图象(background-image)、字体颜色(color…

“Java跌落向下,Python奋斗向前”,程序员:看哭了...

还记得被Java统治的时代吗&#xff1f;最近&#xff0c;这个格局已经被悄然打破&#xff0c;正是被来自曾经的小弟&#xff0c;新晋网红Python给硬生生拽下神坛。对此&#xff0c;Java曾表示强烈质疑&#xff0c;最近一份数据榜单悄悄来了&#xff01;PLPY 8月榜单官宣&#xf…

注册docker hub账号

官网地址&#xff1a;https://hub.docker.com

浏览器渲染流水线解析与网页动画性能优化

摘要&#xff1a;若干年前&#xff0c;我写过一篇介绍浏览器渲染流水线的文章 - How Rendering Work (in WebKit and Blink)&#xff0c;这篇文章&#xff0c;一来部分内容已经过时&#xff0c;二来缺少一个全局视角来对流水线整体进行分析&#xff0c;所以打算重新写一篇新的文…

努比亚手机浏览器 安全证书失效_浏览器提示“该站点安全证书的吊销信息不可用”的解决方法-...

最近有用户遇到在Win10系统下浏览网页时&#xff0c;系统一直会提示安全警报&#xff0c;提示内容为“该站点安全证书的吊销信息不可用。是否继续&#xff1f;”&#xff0c;那么该如何解决呢&#xff1f;其实这大部分都是网页和浏览器的一些问题造成的&#xff0c;下面小编就为…

2021浙江高考宁波四中成绩查询,2021浙江高考成绩查询时间公布 几号能查分

2021年浙江省高考成绩26日左右可查询&#xff0c;分段填报志愿日程确定啦。下面一起来看看吧。第一段什么时候报志愿普通类提前录取和第一段、艺术类第一批和第二批第一段、体育类第一段同时填报志愿&#xff0c;填报时间为6月29日至6月30日。普通类第二段、艺术类第二批第二段…

还在用 Dockerfile 部署 Spring Boot?out 啦!试试谷歌的大杀器 Jib

之前gblfy和大家分享过一篇将 Spring Boot 项目部署到远程 Docker 上的文章&#xff1a; 一键部署 Spring Boot 到远程 Docker 容器 但是这种部署有一个问题&#xff0c;就是一个小小的 helloworld 构建成镜像之后&#xff0c;竟然都有 660 MB&#xff0c;这就有点过分了&…

常见的Hadoop十大应用误解

戳蓝字“CSDN云计算”关注我们哦&#xff01;作者 | 大数据架构师本文链接&#xff1a;https://www.jianshu.com/p/08255fa980e4Hadoop是一个由Apache基金会所开发的分布式系统基础架构。用户可以在不了解分布式底层细节的情况下&#xff0c;开发分布式程序。充分利用集群的威力…

解析DataWorks数据集成中测试连通性失败问题

摘要&#xff1a; 大家好&#xff0c;这里和大家分享的是DataWorks数据集成中测试连通性失败的排查思路。与测试连通性成功与否的相关因素有很多&#xff0c;本文按照多个因素逐步排查&#xff0c;最终解决问题&#xff0c;希望大家以后再遇到此类问题&#xff0c;请参考此文&a…

带有下标的赋值维度不匹配_不稳定的期权时间价值

教科书上的期权公式&#xff1a;期权价格内在价值时间价值。这是个静态的表述&#xff0c;假设标的、波动率在到期前不在变化。实际上&#xff0c;在存续期间&#xff0c;这块时间价值将会受到“方向、波动率、时间”等维度影响。期权作为时间消耗性金融衍生品&#xff0c;若期…