Code:
<!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" xml:lang="en" lang="en">
<head>
<title></title>
<style type="text/css">
/*<![CDATA[*/
#mask {
position:fixed;z-Index:100px;left:0px;bottom:0px;width:100%;height:0px;background-Color:#FFCC66;
/* Moz */
opacity: .5;
/* IE5-7 */
filter: alpha(opacity=50);
/* IE8 */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}
#thanks {
position:fixed;z-Index:101px;left:200px;top:-1200px;width:400px;height:300px;background-Color:#FFFFCC;border:solid red 1px;font-Size:40px;text-Align:center;
}
/*]]>*/
</style></head>
<body>
<form onsubmit="return zxcSplashMessage.Open('thanks',this,5000);" action="mypage.php" >
<input name="tom" />
<input type="submit" name="" value="Submit" />
</form>
<div id="mask" ></div>
<div id="thanks" >Thank You</div>
<script type="text/javascript">
/*<![CDATA[*/
zxcSplashMessage={
Open:function(id,frm,ms){
var o=this['zxc'+id];
if (o){
o.msk.style.height=o.msk.offsetTop+'px';
o.mess[0].style.left=(o.msk.offsetWidth-o.w)/2+'px';
o.mess[0].style.top=(o.msk.offsetHeight-o.h)/2+'px';
this.animate(o,o.mess,o.mess[3],o.mess[1],new Date(),o.ms,frm,ms);
}
return false;
},
init:function(o){
var id=o.MessageID,msk=document.getElementById(o.MaskID),ms=o.Animate,mess=document.getElementById(id),w,h;
if (mess){
w=mess.offsetWidth;
h=mess.offsetHeight;
msk=msk||document.createElement('DIV');
msk.style.position='fixed';
msk.style.left='0px';
msk.style.bottom='0px';
msk.style.width='100%';
msk.style.height='0px';
this['zxc'+id]={
mess:[mess,[0,w,h,0],[h/2,w/2,h/2,w/2],[h/2,w/2,h/2,w/2]],
w:w,
h:h,
msk:msk,
ms:typeof(ms)=='number'&&ms>0?ms:1000
}
document.body.appendChild(msk);
document.body.appendChild(mess);
}
},
animate:function(o,a,f,t,srt,mS,frm,dly){
clearTimeout(a[7]);
var oop=this,ms=new Date()-srt,n,z0=0;
for (;z0<4;z0++){
n=(t[z0]-f[z0])/mS*ms+f[z0];
a[3][z0]=Math.max(Math.round(isFinite(n)?n:a[4][z0]),0);
}
oop.cng(a,a[3]);
if (ms<mS){
a[7]=setTimeout(function(){ oop.animate(o,a,f,t,srt,mS,frm,dly); },10);
}
else {
frm?a[7]=setTimeout(function(){ frm.submit(); },dly||mS):null;
oop.cng(a,t);
}
},
cng:function(a,t){
a[0].style.clip='rect('+t[0]+'px,'+t[1]+'px,'+t[2]+'px,'+t[3]+'px)';
}
}
zxcSplashMessage.init({
MessageID:'thanks',
MaskID:'mask',
Animate:1000
});
/*]]>*/
</script></body>
</html>
Bookmarks