div隐藏和显示
点击按扭后显示DIV,当然这个DIV就显示在按扭旁边,当鼠标移动到DIV上时无变化,当鼠标移出DIV的时候,让DIV隐藏,怎么弄啊!...
点击按扭后显示DIV,当然这个DIV 就显示在按扭旁边,当鼠标移动到DIV上时无变化,当鼠标移出DIV的时候,让DIV隐藏,怎么弄啊!
展开
8个回答
展开全部
比较简单的实现.style.display就是控制层隐藏或显示的属性.
<html>
<body>
<script>
function show(){
document.getElementById("div").style.display="";
//alert(document.getElementById("div").style.display)
}
function hidden(){
document.getElementById("div").style.display="none";
//alert(document.getElementById("div").style.display)
}
</script>
<BODY>
<input name="name" type="button" onClick="show();" value="显示">
<div id="div" style="display: none" onMouseout="hidden();">
show it
</div>
</BODY>
</HTML>
<html>
<body>
<script>
function show(){
document.getElementById("div").style.display="";
//alert(document.getElementById("div").style.display)
}
function hidden(){
document.getElementById("div").style.display="none";
//alert(document.getElementById("div").style.display)
}
</script>
<BODY>
<input name="name" type="button" onClick="show();" value="显示">
<div id="div" style="display: none" onMouseout="hidden();">
show it
</div>
</BODY>
</HTML>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<!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=gb2312" />
<title>我的test</title>
</head>
<script type="text/javascript" language="javascript">
function h()
{
var aa=document.getElementById('aa');
if(aa.offsetHeight<=500)
{
aa.style.height=aa.offsetHeight+5+"px";
setTimeout("h()",5);
aa.style.display='block';
}
}
function test()
{
var aa=document.getElementById('aa');
aa.style.height=aa.offsetHeight-5+"px";
if(aa.offsetHeight>0)
{
setTimeout("test()",5);
}
else if(aa.offsetHeight<=0)
{
aa.style.display='none';
}
}
</script>
<style type="text/css">
</style>
<body>
<form>
<div id='aa'style=" background:url(1.png); background-color:#CC00CF; display:block">
<br/>
<br/> </div>
<div id='bb'>
dddddddddddddddddddddddddddddd
</div>
<input name="tryok" type="button" value="试试看" onClick="test()">
<input name="dis" type="button" value="显示" onClick="h()">
</form>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>我的test</title>
</head>
<script type="text/javascript" language="javascript">
function h()
{
var aa=document.getElementById('aa');
if(aa.offsetHeight<=500)
{
aa.style.height=aa.offsetHeight+5+"px";
setTimeout("h()",5);
aa.style.display='block';
}
}
function test()
{
var aa=document.getElementById('aa');
aa.style.height=aa.offsetHeight-5+"px";
if(aa.offsetHeight>0)
{
setTimeout("test()",5);
}
else if(aa.offsetHeight<=0)
{
aa.style.display='none';
}
}
</script>
<style type="text/css">
</style>
<body>
<form>
<div id='aa'style=" background:url(1.png); background-color:#CC00CF; display:block">
<br/>
<br/> </div>
<div id='bb'>
dddddddddddddddddddddddddddddd
</div>
<input name="tryok" type="button" value="试试看" onClick="test()">
<input name="dis" type="button" value="显示" onClick="h()">
</form>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询