请教高手修改一种页面效果

moplusplus 2008-04-10 09:41:23

效果如下：
http://www.jscode.cn/jscode/code_360804725.htm
想做以下修改：
1.当新的小窗口弹出时，背景颜色不要变暗，即大窗口保持原来的蓝色
2.小窗口的尺寸如何变化？
3.小窗口的初始位置如何变化，就是刚刚弹出时的位置该如何定？
4.在新弹出的小窗口中的内容能否和数据库进行关联？对于从数据库中读出的数据显示时能否实现分页？

谢谢！

...全文

59 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

moplusplus 2008-04-10

打赏
举报

请高手帮忙

moplusplus 2008-04-10

打赏
举报

如果我想让弹出的小窗口在字段的右边，紧贴字段，该修改哪些变量呢？

moplusplus 2008-04-10

打赏
举报

请问高手窗口的初始位置和哪些变量有关呢？

itzhiren 2008-04-10

打赏
举报

1、
<!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" lang="zh-CN">

<head>

<meta http-equiv="Content-Language" content="zh-cn" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="robots" content="all" />
<meta name="author" content="在远方@#" />
<meta name="Copyright" content="Copyright (c) #" />
<link rel="icon" href="/favicon.ico" type="image/x-icon" media="screen" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" media="screen" />
<meta name="description" content="网页特效观止" />
<meta name="keywords" content="网页特效,网页特效代码" />

<title>点击弹出窗口层，并且背景变暗渐变---网页特效观止|#|网页特效代码</title>
<style>
body {font-size:12px;background:#9EC7E7}
img {border:0px}
#msgDiv {
z-index:10001;
width:500px;
height:400px;
background:white;
border:#336699 1px solid;
position:absolute;
left:50%;
top:20%;
font-size:12px;
margin-left:-225px;
display: none;
}
#bgDiv {
display: none;
position: absolute;
top: 0px;
left: 0px;
right:0px;
background-color: #777;
filter:progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75)
opacity: 0.6;
}
</style>
<script type="text/javascript">
function showDetail() { //在远方www.jscode.cn
//定义窗口
var msgObj=document.getElementById("msgDiv");
msgObj.style.marginTop = -75 + document.documentElement.scrollTop + "px";

//关闭
document.getElementById("msgShut").onclick = function(){
msgObj.style.display = "none";
}
msgObj.style.display = "block";
msgDetail.innerHTML="<p align=center>小窗口里的内容</p><p align=center><A href=#><FONT color=#0000ff>网页特效观止</FONT></A></p>"
}
</script>
</head>

<body>

<div id="msgDiv">
<div id="msgShut">
关闭</div>
<div id="msgDetail">
</div>
</div>
<div id="bgDiv">
</div>
<p>　</p>
<p><a href="#" onClick="showDetail()">点击我试试看</a></p>
<p>　</p>
<p>　</p>
<p>　</p>
<p>　</p>
<p>更多网页特效代码尽在 <a href="#">网页特效观止</a></p>

</body>

</html>
2、3、都在
#msgDiv {
z-index:10001;
width:500px;
height:400px;
background:white;
border:#336699 1px solid;
position:absolute;
left:50%;
top:20%;
font-size:12px;
margin-left:-225px;
display: none;
}
中修改

itzhiren 2008-04-10

打赏
举报

DIV设置:
style="overflow:scroll"
或者:
style="overflow:auto"

moplusplus 2008-04-10

打赏
举报

请问div上能有滚动条吗？

itzhiren 2008-04-10

打赏
举报

紧贴“点击我试试看”：

<!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" lang="zh-CN">

<head>

<meta http-equiv="Content-Language" content="zh-cn" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="robots" content="all" />
<meta name="author" content="在远方@#" />
<meta name="Copyright" content="Copyright (c) #" />
<link rel="icon" href="/favicon.ico" type="image/x-icon" media="screen" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" media="screen" />
<meta name="description" content="网页特效观止" />
<meta name="keywords" content="网页特效,网页特效代码" />

<title>点击弹出窗口层，并且背景变暗渐变---网页特效观止|#|网页特效代码</title>
<style>
body {font-size:12px;background:#9EC7E7}
img {border:0px}
#msgDiv {
z-index:10001;
width:500px;
height:400px;
background:white;
border:#336699 1px solid;
position:absolute;
left:31%;
top:20%;
font-size:12px;
margin-left:-225px;
display: none;
}
#bgDiv {
display: none;
position: absolute;
top: 0px;
left: 0px;
right:0px;
background-color: #777;
filter:progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75)
opacity: 0.6;
}
</style>
<script type="text/javascript">
function showDetail() { //在远方www.jscode.cn
//定义窗口
var msgObj=document.getElementById("msgDiv");
msgObj.style.marginTop = -75 + document.documentElement.scrollTop + "px";

//关闭
document.getElementById("msgShut").onclick = function(){
msgObj.style.display = "none";
}
msgObj.style.display = "block";
msgDetail.innerHTML="<p align=center>小窗口里的内容</p><p align=center><A href=#><FONT color=#0000ff>网页特效观止</FONT></A></p>"
}
</script>
</head>

<body>

<div id="msgDiv">
<div id="msgShut">
关闭</div>
<div id="msgDetail">
</div>
</div>
<div id="bgDiv">
</div>
<p>　</p>
<p><a href="#" onClick="showDetail()">点击我试试看</a></p>
<p>　</p>
<p>　</p>
<p>　</p>
<p>　</p>
<p>更多网页特效代码尽在 <a href="#">网页特效观止</a></p>

</body>

</html>

itzhiren 2008-04-10