`

改善用户体验之alert提示效果

JavaScriptMicrosoftGmailCSSBBS 
阅读更多
http://bbs.blueidea.com/thread-1725038-1-1.html
http://www.smashingmagazine.com/2007/08/17/404-error-pages-reloaded/
xml 代码
  1. <!---->>  
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">  
  3.     <head>  
  4.         <meta name="verify-v1" content="P4T6fFCiPVxqMWZ2eztyXVzMHlnwD0wLQOq6LBHN5Y8=" />  
  5.         <title>  
  6.             政策文件_中国电力工程造价信息网title>  
  7.         <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
  8.         <meta http-equiv="Content-Language" content="gb2312" />  
  9.         <meta name="KeyWords" content="电力工程造价,价格信息,装材,设备,电力工程" />  
  10.         <meta name="description" content="电力工程造价信息" />  
  11.         <style type="text/css">  
  12.             *{   
  13.                 margin:0;padding:0;   
  14.             }   
  15.         style>  
  16.     head>  
  17.     <body>  
  18.        
  19.     <div class="cecmbody" id="cecmpolicy">  
  20.         <div class="leftClass">  
  21.                
  22. <p>测试p><p>测试p>  
  23.             <p>测试p><p>测试p><p>测试p><p>测试p><p>测试p>  
  24.             <p>测试p><p>测试p><p>测试p><p>测试p><p>测试p><p>测试p><p>测试p><p>测试p>  
  25.             <input type="button" value="点击这里" onclick="sAlert('测试效果');" />  
  26.            
  27.         div>  
  28.         <div class="rightClass">  
  29.         div>     
  30.     div>  
  31.                 <script type="text/javascript" language="javascript">  
  32. //Author:Daviv   
  33. //Blog:http://blog.163.com/jxdawei   
  34. //Date:2006-10-27   
  35. //Email:jxdawei@gmail.com   
  36.             function sAlert(str){   
  37.             var msgw,msgh,bordercolor;   
  38.             msgw=400;//提示窗口的宽度   
  39.             msgh=100;//提示窗口的高度   
  40.             titleheight=25 //提示窗口标题高度   
  41.             bordercolor="#336699";//提示窗口的边框颜色   
  42.             titlecolor="#99CCFF";//提示窗口的标题颜色   
  43.                
  44.             var sWidth,sHeight;   
  45.             sWidth=document.body.offsetWidth;   
  46.             sHeight=screen.height;   
  47.             var bgObj=document.createElement("div");   
  48.             bgObj.setAttribute('id','bgDiv');   
  49.             bgObj.style.position="absolute";   
  50.             bgObj.style.top="0";   
  51.             bgObj.style.background="#777";   
  52.             bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";   
  53.             bgObj.style.opacity="0.6";   
  54.             bgObj.style.left="0";   
  55.             bgObj.style.width=sWidth + "px";   
  56.             bgObj.style.height=sHeight + "px";   
  57.             bgObj.style.zIndex = "10000";   
  58.             document.body.appendChild(bgObj);   
  59.                
  60.             var msgObj=document.createElement("div")   
  61.             msgObj.setAttribute("id","msgDiv");   
  62.             msgObj.setAttribute("align","center");   
  63.             msgObj.style.background="white";   
  64.             msgObj.style.border="1px solid " + bordercolor;   
  65.             msgObj.style.position = "absolute";   
  66.             msgObj.style.left = "50%";   
  67.             msgObj.style.top = "50%";   
  68.             msgObj.style.font="12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";   
  69.             msgObj.style.marginLeft = "-225px" ;   
  70.             msgObj.style.marginTop = -75+document.documentElement.scrollTop+"px";   
  71.             msgObj.style.width = msgw + "px";   
  72.             msgObj.style.height =msgh + "px";   
  73.             msgObj.style.textAlign = "center";   
  74.             msgObj.style.lineHeight ="25px";   
  75.             msgObj.style.zIndex = "10001";   
  76.       
  77.            var title=document.createElement("h4");   
  78.            title.setAttribute("id","msgTitle");   
  79.            title.setAttribute("align","right");   
  80.            title.style.margin="0";   
  81.            title.style.padding="3px";   
  82.            title.style.background=bordercolor;   
  83.            title.style.filter="progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";   
  84.            title.style.opacity="0.75";   
  85.            title.style.border="1px solid " + bordercolor;   
  86.            title.style.height="18px";   
  87.            title.style.font="12px Verdana, Geneva, Arial, Helvetica, sans-serif";   
  88.            title.style.color="white";   
  89.            title.style.cursor="pointer";   
  90.            title.innerHTML="关闭";   
  91.            title.onclick=function(){   
  92.                 document.body.removeChild(bgObj);   
  93.                 document.getElementById("msgDiv").removeChild(title);   
  94.                 document.body.removeChild(msgObj);   
  95.                 }   
  96.            document.body.appendChild(msgObj);   
  97.            document.getElementById("msgDiv").appendChild(title);   
  98.            var txt=document.createElement("p");   
  99.            txt.style.margin="1em 0"  
  100.            txt.setAttribute("id","msgTxt");   
  101.            txt.innerHTML=str;   
  102.            document.getElementById("msgDiv").appendChild(txt);   
  103.             }   
  104.         script>  
  105.     body>  
  106. html>  
分享到：
| 用java获取全部文件名
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics