Html中鼠标悬停显示二级菜单的两种方法

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
ul{
list-style: none;
float: left;
}
li{
display: none;
}
</style>
<script type="text/javascript">
function disp(){
for(var i = 0; i<3; i++){
document.getElementsByClassName(‘sss‘)[i].style.display=‘block‘;
}
}
function out(){
for(var i = 0; i<3; i++){
document.getElementsByClassName(‘sss‘)[i].style.display=‘none‘;
}
}
</script>
</head>
<body>
<ul onmouseover="disp()" onmouseout="out()"> 手机数码
<li class="sss">iPhone</li>
<li class="sss">SAMSUNG</li>
<li class="sss">SAMSUNG</li>
</ul>
</body>
</html>

方法二

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
li:hover #b{
display: block;
}
#b{
display: none;
}
</style>
</head>
<body>
<ul>
<li>sss
<ul id="b">
<li ></li>
<li ></li>
<li ></li>
<li ></li>
</ul>
</li>
</ul>
</body>
</html>

时间： 2024-12-21 21:18:01

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

Selenium笔记---鼠标悬停显示二级菜单点击下拉列表

WebElement menu1=driver....... WebElement menu2=driver....... Actions builder = new Actions(driver); Actions hoverOverRgeistrar = builder.moveToElement(menu1); hoverOverRgeistrar.perform(); menu2.click(); // builder.moveToElement(element).perform();

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

利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一: 1 2 document.getElementById("EleId").style.visibility="hidden"; document.getElementById("EleId").style.visibility="visible"; 利用上述方法实现隐

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

oracle 中随机取一条记录的两种方法 V_COUNT INT:=0; V_NUM INT :=0; 1:TBL_MYTABLE 表中要有一个值连续且唯一的列FID BEGIN SELECT COUNT(*) INTO V_COUNT FROM TBL_MYTABLE; SELECT TRUNC(DBMS_RADOM.VALUE(1,V_COUNT+1)) INTO V_NUM FROM DUAL; SELECT * FROM TBL_MYTABLE T WHERE T.FID=V_NUM;

关于网页中不刷新页面改变验证码的两种方法

今天做一个注册的页面,需要输入验证码.验证码的生成是动态的,不过要刷新页面,才能改变验证码,因为刷新后浏览器会向服务器提交新的请求,服务器就动态生成新的验证码响应给浏览器.为了能够在不刷新页面的情况下改变验证码,需要JavaScript的支持. 第一种方法是在请求地址后面带参数,这是一个小窍门.因为浏览器访问服务器的时候地址后面可以带上参数一起传给服务器,而加载内容是只看地址不看后面的参数:另外在<img src="地址"/>中,只要浏览器发现地址改变了就会自动重新加载该地

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

Json是一种类似于XML的通用数据交换格式,具有比XML更高的传输效率;本文将介绍两种方法解析JSON数据,需要的朋友可以参考下 Json是一种类似于XML的通用数据交换格式,具有比XML更高的传输效率. 从结构上看,所有的数据(data)最终都可以分解成三种类型: 第一种类型是标量(scalar),也就是一个单独的字符串(string)或数字(numbers),比如"北京"这个单独的词. 第二种类型是序列(sequence),也就是若干个相关的数据按照一定顺序并列在一起,又叫做数组

JS中如何在外部引用私有变量的两种方法复习

引用:https://blog.csdn.net/liwenfei123/article/details/77964222 运用闭包的特权方法在构造函数中定义特权方法这种模式在构造函数中定义了所有私有变量和函数. 能够在构造函数中定义特权方法是因为特权方法作为闭包,能够访问在构造函数中定义的所有变量和函数. function product(){ var name='yuxiaoliang'; this.getName=function(){ return name; } } var obj

鼠标悬浮显示二级菜单

1.布局: <div class="show"> <img src="~/images/head_icon.png" /> <div class="drop" style=" display:none; z-index:80000" id="profileMenu"> <ul> <li> <a class="pass" s

java中按字节获得字符串长度的两种方法

jdk本身就自带获取字符串字节长度的api了,但字符串如果包含特殊符号或全半角符号或标点符号获取到的结果会有偏差,最好的证据就是新浪微博的字数统计了 // jdk自带的获取字节长度 //注意getBytes()默认获取的是以文件编码格式的bytes,通常都是UTF-8(可以看api),不同编码格式的bytes,获取到的长度也不同,本人亲自测试过,建议获取有指定编码格式的bytes长度,如:getBytes("UTF-8") int length = new String().getBy

QT 中设置按钮图片和文字的两种方法

1.使用QpushButton自带的API实现: void setIcon(const QIcon &icon) void setText(const QString &text) 该方法使用了自带的函数设置,缺点是无法自由调整图标和文字之间的间距 2.使用Qlabel和布局嵌入在自带的QpushButton中 QLabel* label = new QLabel(); QLabel* label2 = new QLabel(); label2->setStyleSheet(QStr