设为首页收藏本站新闻投稿

MOD中国同盟社

 找回密码
 注册

QQ登录

只需一步,快速开始

搜索
查看: 1349|回复: 5

[教程] 仿Ajax弹出窗口 背景半透明 [复制链接]

Rank: 20Rank: 20Rank: 20Rank: 20Rank: 20

帖子
2836
精华
2
声望
12984 点
金币
2999 Mold
被赞许
28 次
注册时间
2006-4-28

Mod中国同盟社至高荣誉

发表于 2010-8-22 09:58:01 |显示全部楼层
  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=gb2312" />
  5. <title>无标题文档</title>
  6. <style type="text/css">
  7. <!--
  8. html,body {height:100%; margin:0px; font-size:12px;}

  9. .mydiv {
  10. background-color: #FFCC66;
  11. border: 1px solid #f00;
  12. text-align: center;
  13. line-height: 40px;
  14. font-size: 12px;
  15. font-weight: bold;
  16. z-index:99;
  17. width: 300px;
  18. height: 120px;
  19. left:50%;
  20. top:50%;

  21. margin-left:-150px!important;
  22. margin-top:-60px!important;

  23. margin-top:0px;

  24. position:fixed!important;
  25. position:absolute;

  26. _top:       expression_r(eval_r(document.compatMode &&
  27.             document.compatMode=='CSS1Compat') ?
  28.             documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :
  29.             document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);

  30. }


  31. .bg {
  32. background-color: #666;
  33. width: 100%;
  34. height: 100%;
  35. left:0;
  36. top:0;
  37. filter:alpha(opacity=50);
  38. opacity:0.5;
  39. z-index:1;

  40. position:fixed!important;
  41. position:absolute;

  42. _top:       expression_r(eval_r(document.compatMode &&
  43.             document.compatMode=='CSS1Compat') ?
  44.             documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :
  45.             document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);

  46. }
  47. -->
  48. </style>
  49. <script language="javascript" type="text/javascript">
  50. function showDiv(){
  51. document.getElementByIdx('popDiv').style.display='block';
  52. document.getElementByIdx('bg').style.display='block';
  53. }

  54. function closeDiv(){
  55. document.getElementByIdx('popDiv').style.display='none';
  56. document.getElementByIdx('bg').style.display='none';
  57. }

  58. </script>
  59. </head>
  60. <body>

  61. <div id="popDiv" class="mydiv" style="display:none;">网页设计大本营欢迎你!<br/>Q群号:26868887<br/>
  62. <a href="javascript:closeDiv()">关闭窗口</a></div>
  63. <div id="bg" class="bg" style="display:none;"></div>
  64. <div style="height:1400px; ">
  65. <p>春江花月夜
  66.     唐 张若虚
  67.    
  68.     春江潮水连海平,海上明月共潮生。<br />
  69.    
  70.    
  71.     滟滟随波千万里,何处春江无月明?<br />
  72.    
  73.     江流宛转绕芳甸,月照花林皆似霰。<br />
  74.    
  75.     空里流霜不觉飞,汀上白沙看不见。<br />
  76.    
  77.     江天一色无纤尘,皎皎空中孤月轮。<br />
  78.    
  79.     江畔何人初见月?江月何年初照人?<br />
  80.    
  81.     人生代代无穷已,江月年年只相似。<br />
  82.    
  83.     不知江月待何人,但见长江送流水。<br />
  84.    
  85.     白云一片去悠悠,青枫浦上不胜愁。<br />
  86.    
  87.     谁家今夜扁舟子?何处相思明月楼?<br />
  88.    
  89.     可怜楼上月徘徊,应照离人妆镜台。<br />
  90.    
  91.     玉户帘中卷不去,捣衣砧上拂还来。<br />
  92.    
  93.     此时相望不相闻,愿逐月华流照君。<br />
  94.    
  95.     鸿雁长飞光不度,鱼龙潜跃水成文。<br />
  96.    
  97.     昨夜闲潭梦落花,可怜春半不还家。<br />
  98.    
  99.     江水流春去欲尽,江潭落月复西斜。<br />
  100.    
  101.     斜月沉沉藏海雾,碣石潇湘无限路。<br />
  102.    
  103. 不知乘月几人归?落花摇情满江树。 </p>
  104. <p><br />
  105.    
  106.    
  107.     </p>
  108. <div style="height:200px; line-height:200px; text-align:center; background:#FFFFCC;"><a href="javascript:showDiv()">点我,弹出层</a></div>


  109. <p>&nbsp;</p>
  110. <p>春天的江潮水势浩荡,与大海连成一片,一轮明月从海上升起,好像与潮水一起涌出来。<br />
  111.     月光照耀着春江,随着波浪闪耀千万里,什么地方的春江没有明亮的月光。<br />
  112.     江水曲曲折折地绕着花草丛生的原野流淌,月光照射着开遍鲜花的树林好像细密的雪珠的闪烁。<br />
  113.     月光象白霜一样从空中流下,感觉不到它的飞翔,它照得江畔的白沙看不见。<br />
  114.     江水、天空成一色,没有些微灰尘,只有明亮的一轮孤月高悬空中。<br />
  115.     江边上什么人最初看见月亮,江上的月亮哪一年最初照耀着人?<br />
  116.     人生一代代地天穷无尽,只有江上的月亮一年年地总是相像。<br />
  117.     不知江上的月亮照耀着什么人,只见长江不断地输送着流水。<br />
  118.     游子象一片白云缓缓地离去,只剩下思妇站在离别的青枫浦不胜忧愁。<br />
  119.     哪家的游子今晚坐着小船在漂流?什么地方有人在明月照耀的楼上相思?<br />
  120.     可怜楼上不停移动的月光,应该照耀着离人的梳妆台。<br />
  121.     美好的闺房中的门帘卷不去月光,在捣衣石上拂去月光但它又来了。<br />
  122.     这时互相望着月亮可是互相听不到声音,我希望随着月光流去照耀着您。<br />
  123.     送信的天鹅能够飞翔很远但不能随月光飞到您身边,送信的鱼龙潜游很远但不能游到您身边,只能在
  124.    
  125.    
  126.     水面激起阵阵波纹。<br />
  127.     昨天晚上梦见花朵落在悠闲的水潭上,可怜春天过了一半还不能回家。<br />
  128.     江水流走春光,春光将要流尽,水潭上月亮晚晚落下,如今又西斜。<br />
  129.     斜月慢慢下沉,藏在海雾里,碣石与潇湘的离人距离无限遥远。<br />
  130.     不知有几人能乘着月光回家,只有那西落的月亮摇荡着离情,洒满了江边的树林。<br />
  131.    
  132.     </p>
  133. </div>
  134. </body>
  135. </html>
复制代码

使用道具 举报

Rank: 3Rank: 3

帖子
348
精华
0
声望
396 点
金币
119 Mold
被赞许
4 次
注册时间
2010-7-31
发表于 2010-8-22 10:10:20 |显示全部楼层
来MODchina这么久,终于坐到沙发了,虽然楼主说的我一点也看不懂

使用道具 举报

Rank: 7Rank: 7Rank: 7

帖子
1179
精华
0
声望
2507 点
金币
738 Mold
被赞许
7 次
注册时间
2009-9-5

黑暗使者 可爱小猫 懒人勋章

发表于 2010-8-22 10:15:00 |显示全部楼层
求助管理、
问一下帖子之外的事情、
我本来1w多积分的尊敬、
现在变成友好了、
能把勋章退了么?
权限不够了

使用道具 举报

Rank: 7Rank: 7Rank: 7

帖子
494
精华
0
声望
2703 点
金币
252 Mold
被赞许
1 次
注册时间
2009-6-8
发表于 2010-11-12 10:52:48 |显示全部楼层
回楼上..HTML...
字数补丁.exe

使用道具 举报

Rank: 2

帖子
90
精华
0
声望
355 点
金币
57 Mold
被赞许
0 次
注册时间
2010-1-5
发表于 2010-11-15 18:09:10 |显示全部楼层
C个头
Xml文档,描述数据的
至于干嘛的...没看懂

使用道具 举报

Rank: 2

帖子
72
精华
0
声望
321 点
金币
67 Mold
被赞许
0 次
注册时间
2011-1-4
发表于 2011-10-13 00:26:23 |显示全部楼层
程序裡面有詩,難道作者是詩人
以後論壇持續不登陸   對吧 對吧 ...

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

回顶部