动网论坛的“模拟windows模态对话框”效果

[ 951 查看 / 1 回复 ]

返回列表
发新话题 回复该主题
不再沉醉
头像

  • 版主
  • 69
  • 69
  • 2008-02-25
2008-09-17 18:21 |只看楼主 1#
t T
  1. /*
  2. 模拟windows模态对话框。
  3. Author: HxyMan
  4. Thanks: Laomi,Fssunwin
  5. Update: 2008-1-20
  6. */
  7. var DvWnd={
  8. $:function(d){return document.getElementById(d)},
  9. move:0,
  10. eventStartX:0,
  11. eventStartY:0,
  12. wndStartX:0,
  13. wndStartY:0,
  14. d:{a:'dvwnd',b:'dvwndtitle',c:'dvwndchild',d:'dvwndstatus',e:'dvwndiframe',g:'dvwndcanvas',w:'DvWnd'},
  15. e:null,
  16. x:function(){return DvWnd.e.clientX;},
  17. y:function(){return DvWnd.e.clientY;},
  18. drag_start:function(e){
  19.   DvWnd.e=e;
  20.   DvWnd.move=1;
  21.   DvWnd.eventStartX=DvWnd.x();
  22.   DvWnd.eventStartY=DvWnd.y();
  23.   DvWnd.wndStartX=DvWnd.$(DvWnd.d.a).offsetLeft;
  24.   DvWnd.wndStartY=DvWnd.$(DvWnd.d.a).offsetTop;
  25. },
  26. drag_stop:function(e){
  27.   DvWnd.e=e;
  28.   DvWnd.move=0;
  29. },
  30. drag:function(e){
  31.   DvWnd.e=e;
  32.   if(DvWnd.move){
  33.   DvWnd.$(this.d.a).style.left=DvWnd.wndStartX+(DvWnd.x()-DvWnd.eventStartX)+'px';
  34.   DvWnd.$(this.d.a).style.top=DvWnd.wndStartY+(DvWnd.y()-DvWnd.eventStartY)+'px';
  35.   try{document.selection.empty();}catch(er){}
  36.   }
  37. },
  38. close:function(){
  39.   DvWnd.$(DvWnd.d.a).style.display='none';DvWnd.$(DvWnd.d.g).style.display='none';
  40.   var a=document.body;a.removeChild(DvWnd.$(DvWnd.d.a));//a.removeChild(DvWnd.$(DvWnd.d.g));
  41. },
  42. onfocus:function(){
  43.   DvWnd.flash(2);
  44. },
  45. flash:function(n){
  46.   DvWnd.$(DvWnd.d.b).className='dvwndfocus';
  47.   setTimeout(function(){DvWnd.$(DvWnd.d.b).className='dvwndtitle';},50);
  48.   if(n>1){setTimeout(function(){DvWnd.flash(n-1);},100);}
  49. },
  50. open:function(){
  51.   var de=document.documentElement;
  52.   var w=window.innerWidth || self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
  53.   var ch=window.innerHeight || self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight;
  54.   if (self.pageYOffset) {
  55.   var st=self.pageYOffset;
  56.   } else if (de&&de.scrollTop){  // Explorer 6 Strict
  57.   var st=de.scrollTop;
  58.   } else if (document.body) {// all other Explorers
  59.   var st=document.body.scrollTop;
  60.   }
  61.   if (window.innerHeight && window.scrollMaxY) {
  62.   var sh=window.innerHeight + window.scrollMaxY;
  63.   } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
  64.   var sh=document.body.scrollHeight;
  65.   } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
  66.   var sh=document.body.offsetHeight;
  67.   }
  68.   var a=arguments;
  69.   DvWnd.title=a[0]||'信息窗口';
  70.   DvWnd.para=a[1];//网址或者要显示的内容
  71.   DvWnd.width=a[2]||300;
  72.   DvWnd.height=a[3]||200;
  73.   DvWnd.type=null==a[4]?1:a[4];//1-框架,2-直接显示内容
  74.   DvWnd.canvas=a[5]||{bgc:'#fff',opa:0.1};
  75.   DvWnd.left=a[6]||(w-DvWnd.width)/2+'px';
  76.   DvWnd.top=a[7]||(ch-(DvWnd.height||200))/2+st+'px';
  77.   var dc=document,s='';
  78.   var o=dc.createElement("div");
  79.   o.id=DvWnd.d.a;
  80.   o.className='dvwnd';
  81.   o.style.width=DvWnd.width+'px';
  82.   o.style.height=DvWnd.height+'px';
  83.   o.style.left=DvWnd.left;
  84.   o.style.top=DvWnd.top;
  85.   s+='<div id="'+DvWnd.d.b+'" class="dvwndtitle" onmousedown="'+DvWnd.d.w+'.drag_start(event)" onmouseup="'+DvWnd.d.w+'.drag_stop(event)" onmousemove="'+DvWnd.d.w+'.drag(event)">';
  86.   s+='<span style="float:right"><a href="javascript:'+DvWnd.d.w+'.close();" class="dvwndclose">×</a></span>'+DvWnd.title;
  87.   s+='</div>';
  88.   s+='<div id="'+DvWnd.d.c+'" class="dvwndchild">';
  89.   s+=1==DvWnd.type?('<iframe id="'+DvWnd.d.e+'" name="'+DvWnd.d.e+'" src="about:blank"  style="width:100%;height:'+(DvWnd.height-40)+'px;" frameborder="0" hspace="0"></iframe>'):('<div style="padding:10px;">'+DvWnd.para+'</div>');
  90.   s+='</div>';
  91.   o.innerHTML=s;
  92.   dc.body.appendChild(o);
  93.   var f=0;
  94.   o=DvWnd.$(DvWnd.d.g);
  95.   if(!o){f=1;o=dc.createElement("div");}
  96.   o.id=DvWnd.d.g;
  97.   o.className='dvwndcanvas';
  98.   o.style.height=(sh>ch?sh:ch)+'px';
  99.   o.style.width=w+'px';
  100.   s=DvWnd.canvas;
  101.   o.style.backgroundColor=s.bgc;
  102.   o.style.filter='alpha(opacity='+(s.opa*100)+')';
  103.   o.style.display='block';
  104.   if(f){o.onclick=function(){DvWnd.onfocus()};dc.body.appendChild(o)};
  105.   if(1==DvWnd.type){DvWnd.$(DvWnd.d.e).src=DvWnd.para;}
  106. }
  107. }
复制代码
调用方法：
  1. onclick="DvWnd.open('发送短信','messanger.asp?action=new',800,600,1,{bgc:'black',opa:0.5});"
复制代码
  1. /* CSS Document */
  2. .dvwnd{border:1px #B7E1B4 solid;font-size:12px;background-color:white;font-family:verdana;width:300px;height:auto;position:absolute;z-index:99999}
  3. .dvwndcanvas{z-index:99998;background-color:#ffffff;left:0;top:0;margin:0;padding:0;position:fixed!important;/*FF IE7*/position:absolute;filter:alpha(opacity=10);opacity:0.1;}
  4. .dvwndtitle{background-color:#CEE9CA; cursor:move; font-weight:bold; color:#1E860B; padding:8px;}
  5. .dvwndfocus{background-color:white; cursor:move; font-weight:bold; color:white; padding:8px;}
  6. .dvwndchild{padding:0px;}
  7. a.dvwndclose{background-color:#cc0000;color:white;text-decoration: none;font-size:12px;}
  8. a:hover.dvwndclose{background-color:#ff0000;color:white;text-decoration: none;font-size:12px;}
复制代码
最后编辑不再沉醉 最后编辑于 2008-09-17 20:05:16
分享 转发
TOP
tanlianrenjian
头像

  • 新手上路
  • 1
  • 1
  • 2010-01-26
2010-01-26 15:12 |只看该用户 2#
t T

有dz 弹出窗的源码分析吗？
TOP
返回列表
上一主题 | 下一主题