js怎么做鼠标移过去会显示隐藏的内容?

 我来答
魔鬼傑
推荐于2019-08-28 · TA获得超过5463个赞
知道小有建树答主
回答量:43
采纳率:100%
帮助的人:1.4万
展开全部

步骤:
1、构造好页面内容。

2、在css中设置一个隐藏类hide,类的样式为display:none;设置显示类show,样式为display:block。

3、给需要隐藏的内容设置类名为hide,这样就隐藏了控件。

4、在js标签中,通过控件的类名或者id获取到隐藏对象obhide以及需要监控的对象ob2,再对ob2对象设置onmouseover方法。  在这个方法中,将bohide的类名hide更换成show。这样,在鼠标进入ob2控件之中,就会显示隐藏的obhide的内容。

5、对ob2对象设置onmouseout方法,在这个方法中,将bohide的类名show更换成hide,这样,在鼠标离开ob2控件,就会隐藏obhide的内容。

Li小八Li
2018-01-16 · TA获得超过711个赞
知道答主
回答量:15
采纳率:0%
帮助的人:2319
展开全部


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

<html xmlns="http://www.w3.org/1999/xhtml">  

<head>  

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  

<title>鼠标移上显示,鼠标移开隐藏</title>  

<script language="javascript">  

function mshow(obj)  

{  

document.getElementById("sub"+obj.id).style.visibility="visible";  

}  

function mhidden(obj)  

{  

document.getElementById("sub"+obj.id).style.visibility="hidden";  

}     

</script>  

</head>  

<body>  

<div id="menu1" onmouseover="mshow(this);" onmouseout="mhidden(this);">  

administrators  

</div>  

<div id="submenu1" style="visibility:hidden; z-index:100";onmouseover="this.style.visibility='visible'">  

<p>111</p>  

<p>222</p>  

<p>333</p>  

</div>  

</body>  

</html>

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式