页面右下脚显示层效果,很鬼!请高手帮忙。

好记忆不如烂笔头abc 2009-11-27 11:10:56
页面中如果去掉这行:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
右下角的层可以随滚动条滚动,但是如果保留这行,层就不能滚动。

如果修改javascript代码使其满足有无上述代码都正常,解决立即给分?请高手帮忙。


页面代码如下test.htm:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title> 右下角提示窗口 </title>
<meta name="Description" content="提示窗口">
<meta name="Author" content="nathena.yang">
<script type="text/javascript">
window.onload = getMsg;
function get( id )
{
return document.getElementById(id);
}
function getMsg()
{
var o = get("loft_win");
var getContentHeight = function(){return o.offsetHeight};
var step=1;
var getWinHeight = function(){ return document.compatMode=="CSS1Compat"?document.documentElement.clientHeight:document.body.clientHeight; };
var getScrollTop = function(){return document.body.scrollTop};

function init()
{
o.style.visibility="";
getMsg.timer = setInterval(function(){
if( step >= getContentHeight() )
{
clearInterval(getMsg.timer);
getMsg.timer = null;
}
step++;
o.style.top = (getWinHeight()-step+getScrollTop())+"px";
},5);

window.onscroll = function()
{
if( getMsg.timer )
{
return;
}
o.style.top = (getWinHeight()-getContentHeight()+getScrollTop())+"px";
}
window.onresize = function()
{
if( getMsg.timer )
{
return;
}
o.style.top = (getWinHeight()-getContentHeight()+getScrollTop())+"px";
}
}
init();
}
function mmDiv( o )
{
var c = get("__content");
c.style.display="none";
if( o.innerHTML=="-" )
{
c.style.display="none";
o.innerHTML="口";
flushTimer();
getMsg();
}
else
{
c.style.display="block";
o.innerHTML="-";
flushTimer();
getMsg();
}
}
function flushTimer()
{
if( getMsg.timer )
{
clearInterval(getMsg.timer);
}
}
function closeDiv()
{
var c = get("loft_win");
flushTimer();
c.parentNode.removeChild(c);
}
</script>
<style type="text/css">
<!--
#loft_win {border:#0066FF 1px solid;}
#loft_win_min {border:#0066FF 1px solid;}
.loft_win_head {color: #FFFFFF; font-size:13px; background-color:#0066FF; height:25px; padding:0,5,0,5;}
#contentDiv {background-color:#FFFFFF; border:#0066FF 1px solid; border-left-style:none; border-right-style:none;}
a { font-size:12px; color:#000000;}
a:link {font-size:12px; color:#999999; text-decoration:none;}
a:visited { font-size:12px; color:#999999; text-decoration:none;}
a:hover {font-size:13px; color:#999999; text-decoration:none; border:#FF9900 1px dashed; border-left-style:none; border-right-style:none; border-top-style:none;}
a:actived {font-size:12px; color:#000000; text-decoration:none;}
.textread { color:#FF0000}
.form{ padding:0;margin:0}
-->
</style>
</head>
<body>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<!--提示窗口代码开始-->
<!--初状态-->
<div id="loft_win" style="z-index:1;width:250px;position:absolute;right:0px;visibility:hidden">
<div id="aaaaa"> </div>
<table cellSpacing=0 cellPadding=0 width="100%" bgcolor="#FFFFFF" border=0>
<tr>
<td width="70" class="loft_win_head">留言窗口 </td>
<td align="right" class="loft_win_head">
<span style="cursor:pointer;font-size:12px;font-weight:bold;margin-right:4px;" title=最小化 onclick=mmDiv(this) >- </span>
<span style="cursor:pointer;font-size:12px;font-weight:bold;margin-right:4px;" title=关闭 onclick=closeDiv() >× </span>
</td>
</tr>
</table>
<form action="#" class="form">
<table cellSpacing=2 cellPadding=2 width="100%" border=0 id="__content">
<tr>
<td width="50">内容: </td>
<td class="textread"> <textarea cols="20"> </textarea>* </td>
</tr>
<tr>
<td>姓名: </td>
<td class="textread"> <input type="text" name="_name" id="_name" maxlength="50"> </input>* </td>
</tr>
<tr>
<td>电话: </td>
<td> <input type="text" name="_phone" id="_phone" maxlength="50"> </input> </td>
</tr>
<tr>
<td>QQ: </td>
<td> <input type="text" name="_qq" id="_qq" maxlength="50"> </input> </td>
</tr>
<tr>
<td>  </td>
<td align="left" > <a href="javascript:_SubMsgContent(0)" class="a1"> <font size="1.9">提交 </font> </a> </td>
</tr>
</table>
</form>
</DIV>
<!--提示窗口代码结束-->
</body>
</html>
...全文
71 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
  • 打赏
  • 举报
回复
ok:

var getScrollTop=function(){var scrollTop;if(document.documentElement&&document.documentElement.scrollTop){scrollTop=document.documentElement.scrollTop;}else if(document.body){scrollTop=document.body.scrollTop;}else if(window.pageYOffset){scrollTop=window.pageYOffset;}return scrollTop;}
xiaofan_sap 2009-11-27
  • 打赏
  • 举报
回复
友情帮顶
archko 2009-11-27
  • 打赏
  • 举报
回复
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> 右下角提示窗口 </title>
<meta name="Description" content="提示窗口">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css">
<!--
#loft_win {
border: #0066FF 1px solid;
}

#loft_win_min {
border: #0066FF 1px solid;
}

.loft_win_head {
color: #FFFFFF;
font-size: 13px;
background-color: #0066FF;
height: 25px;
padding: 0, 5, 0, 5;
}

#contentDiv {
background-color: #FFFFFF;
border: #0066FF 1px solid;
border-left-style: none;
border-right-style: none;
}

a {
font-size: 12px;
color: #000000;
}

a:link {
font-size: 12px;
color: #999999;
text-decoration: none;
}

a:visited {
font-size: 12px;
color: #999999;
text-decoration: none;
}

a:hover {
font-size: 13px;
color: #999999;
text-decoration: none;
border: #FF9900 1px dashed;
border-left-style: none;
border-right-style: none;
border-top-style: none;
}

a:actived {
font-size: 12px;
color: #000000;
text-decoration: none;
}

.textread {
color: #FF0000
}

.form {
padding: 0;
margin: 0
}

-->
</style>
<script type="text/javascript">
window.onload=getMsg;
function get(id){
return document.getElementById(id);
}
function getMsg(){
var o=get("loft_win");
var getContentHeight=function(){
return o.offsetHeight
};
var step=1;
var getWinHeight=function(){
return document.compatMode=="CSS1Compat"?document.documentElement.clientHeight:document.body.clientHeight;
};
var getScrollTop=function(){
return document.body.scrollTop
};

function init(){
o.style.visibility="";
getMsg.timer=setInterval(function(){
if(step>=getContentHeight())
{
clearInterval(getMsg.timer);
getMsg.timer=null;
}
step++;
o.style.top=(getWinHeight()-step+getScrollTop())+"px";
},5);

window.onscroll=function(){
if(getMsg.timer){
return;
}
o.style.top=(getWinHeight()-getContentHeight()+getScrollTop())+"px";
}
window.onresize=function(){
if(getMsg.timer){
return;
}
o.style.top=(getWinHeight()-getContentHeight()+getScrollTop())+"px";
}
}

init();
}
function mmDiv(o){
var c=get("__content");
c.style.display="none";
if(o.innerHTML=="-"){
c.style.display="none";
o.innerHTML="劳而无功奇趣";
flushTimer();
getMsg();
} else{
c.style.display="block";
o.innerHTML="-";
flushTimer();
getMsg();
}
}
function flushTimer(){
if(getMsg.timer){
clearInterval(getMsg.timer);
}
}
function closeDiv(){
var c=get("loft_win");
flushTimer();
c.parentNode.removeChild(c);
}
</script>
</head>
<body>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br>
<!--提示窗口代码开始-->
<!--初状态-->
<div id="loft_win" style="z-index:1;width:250px;position:absolute;right:0px;visibility:hidden">
<div id="aaaaa"></div>
<table cellSpacing=0 cellPadding=0 width="100%" bgcolor="#FFFFFF" border=0>
<tr>
<td width="70" class="loft_win_head">留言窗口</td>
<td align="right" class="loft_win_head">
<span style="cursor:pointer;font-size:12px;font-weight:bold;margin-right:4px;" title=最小化 onclick=mmDiv(this)>- </span>
<span style="cursor:pointer;font-size:12px;font-weight:bold;margin-right:4px;" title=关闭 onclick=closeDiv()>× </span>
</td>
</tr>
</table>
<form action="#" class="form">
<table cellSpacing=2 cellPadding=2 width="100%" border=0 id="__content">
<tr>
<td width="50">内容:</td>
<td class="textread"><textarea cols="20"> </textarea>*</td>
</tr>
<tr>
<td>姓名:</td>
<td class="textread"><input type="text" name="_name" id="_name" maxlength="50"/>*</td>
</tr>
<tr>
<td>电话:</td>
<td><input type="text" name="_phone" id="_phone" maxlength="50"/> </td>
</tr>
<tr>
<td>QQ:</td>
<td><input type="text" name="_qq" id="_qq" maxlength="50"/> </td>
</tr>
<tr>
<td>  </td>
<td align="left"><a href="javascript:_SubMsgContent(0)" class="a1"> <font size="1.9">提交 </font> </a></td>
</tr>
</table>
</form>
</DIV>
<!--提示窗口代码结束-->
</body>
</html>

87,993

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧