87,910
社区成员
发帖
与我相关
我的任务
分享JS 隐藏显示DIV
我想实现的功能：
通过JS，点击一个按钮
自动弹出一个DIV在显示器的中央，里面的内容写“请稍后。。。”
并且这个页面的所有信息都不能被点击
过了3秒，DIV自动关闭
哪位知道怎么写的帮我解决下
通过JS，点击一个按钮
自动弹出一个DIV在显示器的中央，里面的内容写“请稍后。。。”
并且这个页面的所有信息都不能被点击
过了3秒，DIV自动关闭
哪位知道怎么写的帮我解决下
...全文
请发表友善的回复…
发表回复
dngoryaner 2010-05-20
- 打赏
- 举报
[Quote=引用 18 楼 curacfyh 的回复:]
引用 3 楼 lin364653705 的回复:
HTML code<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><h……
[/Quote]
这样也行????
引用 3 楼 lin364653705 的回复:
HTML code<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><h……
[/Quote]
这样也行????
curacfyh 2009-12-25
- 打赏
- 举报
[Quote=引用 3 楼 lin364653705 的回复:]
HTML code<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type" content="text/html; charset=gb2312"/><title>无标题文档</title><scripttype="text/javascript">function test(){
divTest.innerHTML="请稍后...";
setTimeout('hideMethod()',3000);
}function hideMethod(){
divTest.style.display="none";
}</script></head><body><formid="form1" method="post"><inputtype="button" onclick="test()" value="测试"/></form><divid="divTest" style="background-color:red"></div></body></html>
直接考下来可以测试！
[/Quote]就是这个
HTML code<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type" content="text/html; charset=gb2312"/><title>无标题文档</title><scripttype="text/javascript">function test(){
divTest.innerHTML="请稍后...";
setTimeout('hideMethod()',3000);
}function hideMethod(){
divTest.style.display="none";
}</script></head><body><formid="form1" method="post"><inputtype="button" onclick="test()" value="测试"/></form><divid="divTest" style="background-color:red"></div></body></html>
直接考下来可以测试！
[/Quote]就是这个
singlion 2009-12-24
- 打赏
- 举报
代码上传到http://www.dbank.com/download.action?t=40&k=Mzc5NDIzNA==&pcode=LCw0NTEyMiw0NTEyMg==&rnd=9763
singlion 2009-12-24
- 打赏
- 举报
我之前做的一个效果，这里不能上传图片，我截了图放在百度空间http://hi.baidu.com/liguocan/album/item/49e41838eea85c14b9998fd2.html
你看下效果。无论窗口大小怎么改变，滚动条滚到什么地方，“消息”都会居中显示。
这个示例中不是弹出的消息，而是一个登录表单，在我提供的js中有示例，轻松控制其中显示的内容，可以使消息。
至于定时消失的问题，我没做，这个应该超级简单，你写个定时函数，到3s就调用win.hide();
待会上传代码
你看下效果。无论窗口大小怎么改变，滚动条滚到什么地方，“消息”都会居中显示。
这个示例中不是弹出的消息，而是一个登录表单，在我提供的js中有示例，轻松控制其中显示的内容，可以使消息。
至于定时消失的问题，我没做，这个应该超级简单，你写个定时函数，到3s就调用win.hide();
待会上传代码
li_maoqi 2009-12-24
- 打赏
- 举报
用两个div，和三楼的思路差不多， 一个div做mask，一个用来显示信息。
dxsky_sky 2009-12-24
- 打赏
- 举报
最好是用两个DIV做，这样子灵活性大。
VirusFu 2009-12-22
- 打赏
- 举报
3楼的代码不完全 我觉得2楼的思路不错
chollaflower 2009-12-22
- 打赏
- 举报
[Quote=引用 8 楼 loveyang7733 的回复:]
我的意思没表明清楚
我是想单击一个按钮后，显示出一个小的DIV在屏幕的中央
过3秒后自动隐藏
[/Quote]
给楼主个思路：用两层的div最外层的铺满整个屏幕，但是隐藏，里面的div用于显示你的提示信息，居中。
3楼的代码大致实现了这个功能，但还是可以点击其他的，也就是不是模态的！还有就是在点击之前是隐藏的，点击之后再显示！
我的意思没表明清楚
我是想单击一个按钮后，显示出一个小的DIV在屏幕的中央
过3秒后自动隐藏
[/Quote]
给楼主个思路：用两层的div最外层的铺满整个屏幕，但是隐藏，里面的div用于显示你的提示信息，居中。
3楼的代码大致实现了这个功能，但还是可以点击其他的，也就是不是模态的！还有就是在点击之前是隐藏的，点击之后再显示！
lin364653705 2009-12-22
- 打赏
- 举报
<!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>无标题文档</title>
<style type="text/css">
.mystyle
{position:absolute;
top:50%;
left:50%;
text-align:center;
margin:-100px 0 0 -100px;
width:200px;
height:100px; /*这里，height和line-height的值设置成一样，使文字垂直居中显示在DIV当中*/
line-height:100px;
background:#000 ;
FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#ffffff', endColorStr='#00009B', gradientType='0');
}
</style>
<div></div>
<script type="text/javascript">
function test(){
document.getElementById("divTest").className="mystyle";
divTest.innerHTML ="请稍后......";
setTimeout('hideMethod()',3000);
}
function hideMethod(){
divTest.style.display="none";
}
</script>
</head>
<body>
<form id="form1" method="post">
<input type="button" onclick="test()" value="测试" />
</form>
<div id="divTest"></div>
</body>
</html>
其实这些问题，给你了一个样式，自己调下就可以得到你想要的结果的。。。
chengximsdn 2009-12-22
- 打赏
- 举报
学习
幸运的意外 2009-12-21
- 打赏
- 举报
这个问题问的人比较多.我也关注一下吧.
低调的感觉 2009-12-21
- 打赏
- 举报
我的意思没表明清楚
我是想单击一个按钮后，显示出一个小的DIV在屏幕的中央
过3秒后自动隐藏
我是想单击一个按钮后，显示出一个小的DIV在屏幕的中央
过3秒后自动隐藏
passself 2009-12-21
- 打赏
- 举报
楼主你要明白原理，首先你点击的时候要弹出层，还要显示三秒，所以，首先你写一个层，当点击的时候要显示出来，写一个定时器，单秒后要hide
hewei_shine 2009-12-21
- 打赏
- 举报
3楼的可以。思路就是将一个透明的div覆盖住整个屏幕，在中间加入想要的文字。
lixiaoyan3 2009-12-21
- 打赏
- 举报
3楼的要是select话，还是可以选的。。。
licip 2009-12-21
- 打赏
- 举报
楼上的行呀。应该是可以的。
lin364653705 2009-12-21
- 打赏
- 举报
<!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>无标题文档</title>
<script type="text/javascript">
function test(){
divTest.innerHTML ="请稍后...";
setTimeout('hideMethod()',3000);
}
function hideMethod(){
divTest.style.display="none";
}
</script>
</head>
<body>
<form id="form1" method="post">
<input type="button" onclick="test()" value="测试" />
</form>
<div id="divTest" style="background-color:red"></div>
</body>
</html>直接考下来可以测试！
happy002 2009-12-21
- 打赏
- 举报
window.showModalDialog(sURL[,vArguments][,sFeatures]); 一个模态窗体，当然页面内容可以自己随便写，然后 setTimeout()3秒之后，window.close()。~
happy002 2009-12-21
- 打赏
- 举报
用模态窗口模拟一个，不一定非得要div
