网页中这样的可关闭提示框如何实现？css
一般网站推出新功能的时候会用到这样的提示框，如图百度分这个。这个提示框默认的是现实的，可以关闭。关闭后不再显示。...
一般网站推出新功能的时候会用到这样的提示框，如图百度分这个。
这个提示框默认的是现实的，可以关闭。关闭后不再显示。 展开
这个提示框默认的是现实的，可以关闭。关闭后不再显示。 展开
3个回答
展开全部
一个很常见的网站提示栏，一般常用于首页，会给出一行提示文字，用方框框起来，再附上一个关闭按钮，配上JS脚本，这样就实现了一个可以关闭的提示框，实际上代码是超简单的，但是功能却是很实用。
<!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>
<title>可关闭的提示框</title>
<style>
#tips
{
position:relative;
margin:0 auto;
border:1px solid
#FA9150;
padding:5px 10px 5px
10px;
width:96%;
background-color:#FEF1E9;
line-height:160%;
font-size:12px;
}
#close
{
position:absolute;
top:7px;
right:8px;
}
</style>
<script>
function
Close() {
document.getElementById("tips").style.display =
"none";
}
window.onload = function()
{
document.getElementById("tips").onclick =
Close;
}
</script>
</head>
<body>
<p
id="tips">
<!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>
<title>可关闭的提示框</title>
<style>
#tips
{
position:relative;
margin:0 auto;
border:1px solid
#FA9150;
padding:5px 10px 5px
10px;
width:96%;
background-color:#FEF1E9;
line-height:160%;
font-size:12px;
}
#close
{
position:absolute;
top:7px;
right:8px;
}
</style>
<script>
function
Close() {
document.getElementById("tips").style.display =
"none";
}
window.onload = function()
{
document.getElementById("tips").onclick =
Close;
}
</script>
</head>
<body>
<p
id="tips">
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
用一个浮动层来实现:
<html>
<head></head>
<body>
这个是测试文字,我看不见了:
<div style="position:absolute; z-index:10; width:200px; height:100px; background-color:#CCCCCC; left: 138px; top: 17px;" id=me ><a href="#" onClick="document.getElementById('me').style.display='none'">点击我关闭</a></div>
</body>
</html>
<html>
<head></head>
<body>
这个是测试文字,我看不见了:
<div style="position:absolute; z-index:10; width:200px; height:100px; background-color:#CCCCCC; left: 138px; top: 17px;" id=me ><a href="#" onClick="document.getElementById('me').style.display='none'">点击我关闭</a></div>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这里有一个弹出提示层效果
可以设置关闭和显示位置
里面有教程和源码
可以设置关闭和显示位置
里面有教程和源码
参考资料： http://www.blueidea.com/common/shoutbox/redir.asp?1=j&id=10818
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
