设为首页收藏本站订阅更新

无忧脚本

 找回密码
 加入无忧

QQ登录

只需一步,快速开始

搜索
查看: 6388|回复: 17

我自己搞的用XHTML+CSS模拟XP的窗口界面!

[复制链接]
发表于 2006-3-24 20:06:49 | 显示全部楼层 |阅读模式
本来是想弄个XP的WEB桌面,但是想了想,没那么多时间!
不如让大家一起搞!
看看能不能东和西凑一下做出来!


大家做出来后!要发表到这个51JS哦!我时间有限的!

[ 本帖由 野草 最后编辑于 2006-3-24 20:08 ]

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?加入无忧

x
发表于 2006-3-26 13:20:09 | 显示全部楼层
下载测试,发现那个窗口 有点意思哈。
我可以拖出几个窗口出来。

将一个拖到左上角去,并进去一半,然后再拖动下面的一个。然后再拖动左上角的一个,哈,出来了。就生出一个来了~~~
有意思~~~~
 楼主| 发表于 2006-3-26 21:46:36 | 显示全部楼层
是啊!
继续研究下!
发表于 2007-5-10 18:12:59 | 显示全部楼层
野草兄弟的东西,看看!
发表于 2007-7-3 17:34:31 | 显示全部楼层
有点意思
发表于 2007-7-8 10:13:00 | 显示全部楼层

真强呀!

做得真好呀!!高手呀!:lol :lol
发表于 2007-7-9 08:30:16 | 显示全部楼层
有意思,好玩,下载了研究研究~~:lol
发表于 2007-7-10 02:57:25 | 显示全部楼层
真牛!。
发表于 2007-7-10 03:12:28 | 显示全部楼层
  1. <script language=JScript>
  2. <!--
  3. //可以打包为js文件;
  4. var x0=0,y0=0,x1=0,y1=0;
  5. var offx=6,offy=6;
  6. var moveable=false;
  7. var hover='orange',normal='#336699';//color;
  8. var index=10000;//z-index;
  9. //开始拖动;
  10. function startDrag(obj)
  11. {
  12.         if(event.button==1)
  13.         {
  14.                 //锁定标题栏;
  15.                 obj.setCapture();
  16.                 //定义对象;
  17.                 var win = obj.parentNode;
  18.                 var sha = win.nextSibling;
  19.                 //记录鼠标和层位置;
  20.                 x0 = event.clientX;
  21.                 y0 = event.clientY;
  22.                 x1 = parseInt(win.style.left);
  23.                 y1 = parseInt(win.style.top);
  24.                 //记录颜色;
  25.                 normal = obj.style.backgroundColor;
  26.                 //改变风格;
  27.                 obj.style.backgroundColor = hover;
  28.                 win.style.borderColor = hover;
  29.                 obj.nextSibling.style.color = hover;
  30.                 sha.style.left = x1 + offx;
  31.                 sha.style.top  = y1 + offy;
  32.                 moveable = true;
  33.         }
  34. }
  35. //拖动;
  36. function drag(obj)
  37. {
  38.         if(moveable)
  39.         {
  40.                 var win = obj.parentNode;
  41.                 var sha = win.nextSibling;
  42.                 win.style.left = x1 + event.clientX - x0;
  43.                 win.style.top  = y1 + event.clientY - y0;
  44.                 sha.style.left = parseInt(win.style.left) + offx;
  45.                 sha.style.top  = parseInt(win.style.top) + offy;
  46.         }
  47. }
  48. //停止拖动;
  49. function stopDrag(obj)
  50. {
  51.         if(moveable)
  52.         {
  53.                 var win = obj.parentNode;
  54.                 var sha = win.nextSibling;
  55.                 var msg = obj.nextSibling;
  56.                 win.style.borderColor     = normal;
  57.                 obj.style.backgroundColor = normal;
  58.                 msg.style.color           = normal;
  59.                 sha.style.left = obj.parentNode.style.left;
  60.                 sha.style.top  = obj.parentNode.style.top;
  61.                 obj.releaseCapture();
  62.                 moveable = false;
  63.         }
  64. }
  65. //获得焦点;
  66. function getFocus(obj)
  67. {
  68.         if(obj.style.zIndex!=index)
  69.         {
  70.                 index = index + 2;
  71.                 var idx = index;
  72.                 obj.style.zIndex=idx;
  73.                 obj.nextSibling.style.zIndex=idx-1;
  74.         }
  75. }
  76. //最小化;
  77. function min(obj)
  78. {
  79.         var win = obj.parentNode.parentNode;
  80.         var sha = win.nextSibling;
  81.         var tit = obj.parentNode;
  82.         var msg = tit.nextSibling;
  83.         var flg = msg.style.display=="none";
  84.         if(flg)
  85.         {
  86.                 win.style.height  = parseInt(msg.style.height) + parseInt(tit.style.height) + 2*2;
  87.                 sha.style.height  = win.style.height;
  88.                 msg.style.display = "block";
  89.                 obj.innerHTML = "0";
  90.         }
  91.         else
  92.         {
  93.                 win.style.height  = parseInt(tit.style.height) + 2*2;
  94.                 sha.style.height  = win.style.height;
  95.                 obj.innerHTML = "2";
  96.                 msg.style.display = "none";
  97.         }
  98. }
  99. //创建一个对象;
  100. function xWin(id,w,h,l,t,tit,msg)
  101. {
  102.         index = index+2;
  103.         this.id      = id;
  104.         this.width   = w;
  105.         this.height  = h;
  106.         this.left    = l;
  107.         this.top     = t;
  108.         this.zIndex  = index;
  109.         this.title   = tit;
  110.         this.message = msg;
  111.         this.obj     = null;
  112.         this.bulid   = bulid;
  113.         this.bulid();
  114. }
  115. //初始化;
  116. function bulid()
  117. {
  118.         var str = ""
  119.                 + "<div id=xMsg" + this.id + " "
  120.                 + "style='"
  121.                 + "z-index:" + this.zIndex + ";"
  122.                 + "width:" + this.width + ";"
  123.                 + "height:" + this.height + ";"
  124.                 + "left:" + this.left + ";"
  125.                 + "top:" + this.top + ";"
  126.                 + "background-color:" + normal + ";"
  127.                 + "color:" + normal + ";"
  128.                 + "font-size:8pt;"
  129.                 + "font-family:Tahoma;"
  130.                 + "position:absolute;"
  131.                 + "cursor:default;"
  132.                 + "border:2px solid " + normal + ";"
  133.                 + "' "
  134.                 + "onmousedown='getFocus(this)'>"
  135.                         + "<div "
  136.                         + "style='"
  137.                         + "background-color:" + normal + ";"
  138.                         + "width:" + (this.width-2*2) + ";"
  139.                         + "height:20;"
  140.                         + "color:white;"
  141.                         + "' "
  142.                         + "onmousedown='startDrag(this)' "
  143.                         + "onmouseup='stopDrag(this)' "
  144.                         + "onmousemove='drag(this)' "
  145.                         + "ondblclick='min(this.childNodes[1])'"
  146.                         + ">"
  147.                                 + "<span style='width:" + (this.width-2*12-4) + ";padding-left:3px;'>" + this.title + "</span>"
  148.                                 + "<span style='width:12;border-width:0px;color:white;font-family:webdings;' onclick='min(this)'>0</span>"
  149.                                 + "<span style='width:12;border-width:0px;color:white;font-family:webdings;' onclick='ShowHide(\""+this.id+"\",null)'>r</span>"
  150.                         + "</div>"
  151.                                 + "<div style='"
  152.                                 + "width:100%;"
  153.                                 + "height:" + (this.height-20-4) + ";"
  154.                                 + "background-color:white;"
  155.                                 + "line-height:14px;"
  156.                                 + "word-break:break-all;"
  157.                                 + "padding:3px;"
  158.                                 + "'>" + this.message + "</div>"
  159.                 + "</div>"
  160.                 + "<div id=xMsg" + this.id + "bg style='"
  161.                 + "width:" + this.width + ";"
  162.                 + "height:" + this.height + ";"
  163.                 + "top:" + this.top + ";"
  164.                 + "left:" + this.left + ";"
  165.                 + "z-index:" + (this.zIndex-1) + ";"
  166.                 + "position:absolute;"
  167.                 + "background-color:black;"
  168.                 + "filter:alpha(opacity=40);"
  169.                 + "'></div>";
  170.         document.body.insertAdjacentHTML("beforeEnd",str);
  171. }
  172. //显示隐藏窗口
  173. function ShowHide(id,dis){
  174.         var bdisplay = (dis==null)?((document.getElementById("xMsg"+id).style.display=="")?"none":""):dis
  175.         document.getElementById("xMsg"+id).style.display = bdisplay;
  176.         document.getElementById("xMsg"+id+"bg").style.display = bdisplay;
  177. }
  178. //modify by haiwa @ 2005-7-14
  179. //
  180. //-->
  181. </script>

  182. <script language='JScript'>
  183. <!--
  184. function initialize()
  185. {
  186. var a = new xWin("1",200,100,350,160,"提示","51js");
  187. }
  188. window.onload = initialize;
  189. //-->
  190. </script>
复制代码
发表于 2012-7-20 14:47:02 | 显示全部楼层
不让下载
发表于 2012-8-2 11:01:30 | 显示全部楼层
下载看看
发表于 2012-8-28 14:10:15 | 显示全部楼层
怎么下载啊?
发表于 2012-9-27 12:07:10 | 显示全部楼层
好东西呀~~~~~~~~~
发表于 2012-10-9 16:44:16 | 显示全部楼层
威望不足,下载不到.纯支持吧
发表于 2012-12-5 14:12:10 | 显示全部楼层
看看,历史有点久远
发表于 2013-1-10 17:01:47 | 显示全部楼层
最近也做了一个  down下来看看
发表于 2013-1-30 11:52:27 | 显示全部楼层
chrome里拖不动。。
您需要登录后才可以回帖 登录 | 加入无忧

本版积分规则

小黑屋|手机版|Archiver|无忧脚本 ( 苏ICP备05080427号 )|值班电话:027-62300445   鄂公网安备 42011102000433号

GMT+8, 2018-1-21 08:32 , Processed in 0.114131 second(s), 7 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表