<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> 
<HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>new document</TITLE> 
<META http-equiv=Content-Type content="text/html; charset=gb2312"> 
<META content="MSHTML 6.00.2900.2180" name=GENERATOR> 
<META content="" name=author> 
<META content="" name=keywords> 
<META content="" name=description> 
<STYLE type=text/css>#show_feedBack_message { 
BORDER-RIGHT: #f00 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #f00 1px solid; PADDING-LEFT: 3px; FONT-SIZE: 12px; BACKGROUND: #fc0; PADDING-BOTTOM: 3px; BORDER-LEFT: #f00 1px solid; LINE-HEIGHT: 18px; PADDING-TOP: 3px; BORDER-BOTTOM: #f00 1px solid 
} 
{ 
FONT-SIZE: 12px 
} 
OL LI { 
MARGIN: 15px 0px 
} 
OL LI A { 
FONT-SIZE: 14px; COLOR: #00f 
} 
</STYLE> 
</HEAD> 
<BODY> 
<SCRIPT type=text/javascript> 
<!-- 
/* 
message:要显示的消息 
x,y:显示消息框的坐标,默认为左上角 
delay:延迟多长时间消失,-1为永不消失,单位为毫秒 
*/ 
function feedBackMessage(message,x,y,delay){ 
if(!message) return; 
//只允许百分数或数值参数 
x=https://www.jb51.net/\d{1,2}%|100%|left|right/.test(x)?x:(parseInt(x)||0)+"px"; 
y=https://www.jb51.net/\d{1,2}%|100%|top|bottom/.test(y)?y:(parseInt(y)||0)+"px"; 
delay=parseInt(delay)||-1; 
var fdDiv=document.getElementById('show_feedBack_message'); 
if(!fdDiv){ 
var showMessage=document.createElement("<div></div>"); 
document.body.appendChild(showMessage); 
fdDiv=document.getElementById('show_feedBack_message'); 
} 
if(feedBackMessage.timer){clearInterval(feedBackMessage.timer)} 
fdDiv.innerHTML=message; 
fdDiv.style.display=""; 
var docWidth=document.documentElement.scrollWidth>document.documentElement.clientWidth?document.documentElement.scrollWidth:document.documentElement.clientWidth; 
var docHeight=document.documentElement.scrollHeight>document.documentElement.clientHeight?document.documentElement.scrollHeight:document.documentElement.clientHeight; 
if(/left|right/.test(x)){ 
x=(x=="left")?"0px":(docWidth-fdDiv.offsetWidth)+"px"; 
} 
if(/top|bottom/.test(y)){ 
y=(y=="top")?"0px":(docHeight-fdDiv.offsetHeight)+"px"; 
} 
fdDiv.style.left=x; 
fdDiv.style.top=y; 
fdDiv.filters.Alpha.Opacity=100; 
//渐隐效果 
var step=parseInt(delay/100); 
var alpha=fdDiv.filters.Alpha.Opacity; 
if(delay!=-1){ 
feedBackMessage.timer=setInterval(function(){ 
if(fdDiv.filters.Alpha.Opacity>0){ 
fdDiv.filters.Alpha.Opacity-- 
}else{ 
clearInterval(feedBackMessage.timer); 
fdDiv.style.display="none" 
} 
},step); 
} 
} 
//--> 
</SCRIPT> 
<DIV> 
<DIV> 
<OL> 
<LI>(默认设置)显示位置:左上角 消失时间:不消失<BR><BR><A 
onclick="feedBackMessage('消息提示测试1......');return false" 
href="#">feedBackMessage('消息提示测试......')</A> 
<LI>显示位置:left:200px,top:200px 消失时间:5秒后<BR><BR><A 
onclick="feedBackMessage('消息提示测试1......','200','200',5000);return false" 
href="#">feedBackMessage('消息提示测试1......','200','200',5000)</A> 
<LI>显示位置:页面右上部 消失时间:3秒后<BR><BR><A 
onclick="feedBackMessage('消息提示测试2......','right','top',3000);return false" 
href="#">feedBackMessage('消息提示测试2......','right','top',3000)</A> 
<LI>显示位置:left:50%,top:50% 消失时间:2秒后<BR><BR><A 
onclick="feedBackMessage('消息提示测试3......','50%','50%',2000);return false" 
href="#">feedBackMessage('消息提示测试3......','50%','50%',2000)</A> 
<LI>显示位置:left:500px,top:200px 消失时间:不消失<BR><BR><A 
onclick="feedBackMessage('消息提示测试4......','500','200',-1);return false" 
href="#">feedBackMessage('消息提示测试4......','500','200',-1)</A> </LI></OL></DIV> 
<DIV 
style="FONT-SIZE: 14px; MARGIN: 15px auto; WIDTH: 96%; LINE-HEIGHT: 20px; TEXT-ALIGN: left">函数语法:feedBackMessage(Message,X,Y,Delay) 
<BR><BR><STRONG>参数介绍:</STRONG> <BR><U>Message:</U>必填参数。该参数为要显示的消息内容,可以为html内容 
<BR><U>X:</U>水平方向的位置,可以是数值如50,250等,也可以是百分比如50%,或者是以下两个参数:left(信息框左侧紧邻页面左侧),right(信息框右侧紧邻页面右侧)。默认为left。 
<BR><U>Y:</U>垂直方向的位置,可以是数值,也可以是百分比,或者是以下两个参数:top(信息框顶部紧邻页面顶部),bottom(信息框底部紧邻页面底部)。默认为top。 
<BR><U>Delay:</U>显示时间,即多长时间后消失,单位为毫秒,如5000即5秒后消失,设定为-1则永不消失。默认为-1 
</DIV></DIV> 
</BODY> 
</HTML> 
类似GMAIL的Ajax信息反馈显示
内容版权声明:除非注明,否则皆为本站原创文章。
