标签：style blog http color io os java ar 2014
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>弹窗测试</title> 6 <script src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script> 7 </head> 8 9 <body> 10 <script type="text/javascript" language="javascript"> 11 $(document).ready(function () { 12 //$("#btn_center").click(function () { 13 // hcOpenwin(); 14 //}); 15 }); 16 </script> 17 <div style="width:600px;margin-left:auto;margin-right:auto;margin-top:160px;"> 18 <input type="button" value="居中窗口" id="btn_center" onclick="hcOpenwin()" /> 19 </div> 20 <style type="text/css"> 21 .hcw_window{ width:300px; background-color:#FFAD41; position:absolute; 22 padding:2px; margin:5px; display:none; z-index:999; } 23 .hcw_content{ height:368px; background-color:#FFECA7; font-size:14px; 24 overflow:auto; } 25 .hcw_title{ padding:0 0 2px 2px; color:#FFF; font-size:14px; 26 font-weight:bolder; } 27 .hcw_title img{ float:right; } 28 </style> 29 <div class="hcw_window" id="hcwin0"> 30 <div id="hcw_title" class="hcw_title"><img src="http://image.mamicode.com/info/201409/20181006091528068600.jpg" alt="关闭" />注册抢购</div> 31 <div class="hcw_content"> 弹窗测试 </div> 32 </div> 33 <script type="text/javascript"> 34 //data{id:windowid,pre:classpre,relattop:relattop,relatleft:relatleft} 35 function hcOpenwin(data){ 36 var windowHeight = $(window).height(); 37 var windowWidth = $(window).width(); 38 if(typeof(data)!=‘object‘) var data = new Object(); 39 if(!data.id) data.id = ‘hcwin0‘; 40 var popWidth = $("#"+data.id).width(); 41 var popHeight = $("#"+data.id).height(); 42 var popY=(windowHeight-popHeight)/2; 43 var popX=(windowWidth-popWidth)/2; 44 if(!data.pre) data.pre = ‘hcw_‘; 45 $("#"+data.id).css("top",popY).css("left",popX).css("display","block"); 46 $("#"+data.pre+"title img").click(function(){ 47 $(this).parent().parent().css("display","none"); 48 }); 49 } 50 </script> 51 </body> 52 </html>
标签：style blog http color io os java ar 2014
原文地址：http://www.cnblogs.com/iidf/p/3966805.html
