弹出一个div的效果

Question

php页面中，
点击一处，弹出一个div的效果,如何实现呀 thanks

Answer 1

<!--悬浮框1-->
<div id="xf"  style="position:absolute;left:897px;top:79px;width:95px;height:319px;z-index:1;">
<div class="App_Cont" id="xf1" >
  <h1 style="font-family:'黑体'">想随时收到最新南昌房产资讯吗?</h1>
  <div style="padding:25px 0px 0 5px;">
   <div class="FL" style="margin-top:7px;"><img src="/Mail/images/App_img01.gif"></div>
   <div class="FL tL marR10 lin20 f13" style="margin-left:10px;width:182px;">
   更多南昌最新房产新闻、价格、
房源、评测报道<br>
请免费订阅南昌房产8周刊获取
   </div>
   <div class="clear"></div>
  </div>
   
   <div style="margin:10px 12px 10px 11px;_margin:10px 12px 0px 11px; width:242px; height:1px;
   background:url(/Mail/images/App_dot01.gif) repeat-x;">
   </div>
   
   <div class="cGray tL App_width">
   输入您的QQ号或邮箱或手机号
   </div>
   
   <form action="/Mail/zk_add.php?act=add" method="post" name="myform" onsubmit="return check_submit();">
   <div class="cGray tC App_input">
   <input name="relation" style="border:0;margin-top:3px;width:230px;height:14px;">
   </div>
   
   <div class="App_width">
     <div class="FL cDGray" style="margin-top:12px;">还剩<B><?php echo 10000-select_zh_user();?></B>个订阅名额</div>
     <div class="FR marT10"><!--<img src="/Mail/images/App_btn01.gif" onclick="document.myform.submit();">--><INPUT type="image" src="/Mail/images/App_btn01.gif" name="submit"></div>
     <div class="clear"></div>
  </div>
  </form>
 <!--悬浮框 关闭-->
 <div style="padding:29px 33px 0 0 ;_padding:25px 33px 0 0; text-align:right;">
  <img src="/Mail/images/App_Close.gif"  onClick="document.all.xf1.style.display='none';document.all.sc.style.display='none';document.all.dy.style.display='block';" alt="点击关闭">
  </div> 
</div>
   
<!--悬浮框1end-->
<!--悬浮框1end--> <div id="dy"  style="text-align:right;width:265px;">
<img src="/Mail/images/float_small.gif" style="filter:alpha(opacity=90);" onClick="document.all.xf1.style.display='block';document.all.sc.style.display='block';document.all.dy.style.display='none';" alt="点击展开">
</div>
<!--收藏-->
<div id="sc" style="text-align:left;width:265px;"><a href="javascript:void(0);" onclick="addFav()" ><img src="/Mail/images/Favo.gif" alt="加入收藏，方便查找"></a></div>
</div><script language="JavaScript" type="text/JavaScript">
var verticalpos="frombottom";
if (!document.layers)
function JSFX_FloatTopDiv()
{//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
var startX =window.screen.width-287;
    startY = 473; //startY = document.getElementById("hf").offsetHeight+441;
var ns = (navigator.appName.indexOf("Netscape") != -1);
var d = document;
function ml(id)
{
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x;this.style.top=y;};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : document.documentElement.scrollTop + document.documentElement.clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function()
{
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : document.documentElement.scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight : document.documentElement.scrollTop + document.documentElement.clientHeight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("xf");
stayTopLeft();
}//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
JSFX_FloatTopDiv();
</script>