<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <meta name="keywords" content="站长特效,网页特效,网页特效代码,js特效,js脚本,脚本,广告代码,zzjs,zzjs.net,www.zzjs.net,站长特效 网" /> <meta name="description" content="www.zzjs.net,站长特效网,站长必备js特效及广告代码。以质量为核心,以实用为目的,打造一流网页特效站" /> <title>网页特效 仿google首页拖曳模块效果 站长特效网</title> <mce:style type="text/css"><!-- body{margin:0px;padding:0px;font-size:12px;text-align:center;} body > div{text-align:center;margin-right:auto;margin-left:auto;} .content{width:900px;} .content .left{float:left;width:200px;border:1px solid #FF0000;margin:3px;} .content .center{float:left;border:1px solid #FF0000;margin:3px;width:470px;} .content .right{float:right;width:200px;border:1px solid #FF0000;margin:3px;} .mo{height:auto;border:1px solid #CCC;margin:3px;background:#FFF;} .mo h1{background:#ECF9FF;height:18px;padding:3px;cursor:move;} .mo .nr{height:80px;border:1px solid #F3F3F3;margin:2px;} h1{margin:0px;padding:0px;text-align:left;font-size:12px;height:20px;} h1 span{float:left;} h1 font{float:right;cursor:pointer;} --></mce:style><style type="text/css" mce_bogus="1">body{margin:0px;padding:0px;font-size:12px;text-align:center;} body > div{text-align:center;margin-right:auto;margin-left:auto;} .content{width:900px;} .content .left{float:left;width:200px;border:1px solid #FF0000;margin:3px;} .content .center{float:left;border:1px solid #FF0000;margin:3px;width:470px;} .content .right{float:right;width:200px;border:1px solid #FF0000;margin:3px;} .mo{height:auto;border:1px solid #CCC;margin:3px;background:#FFF;} .mo h1{background:#ECF9FF;height:18px;padding:3px;cursor:move;} .mo .nr{height:80px;border:1px solid #F3F3F3;margin:2px;} h1{margin:0px;padding:0px;text-align:left;font-size:12px;height:20px;} h1 span{float:left;} h1 font{float:right;cursor:pointer;}</style> <mce:script language="javascript"><!-- var dragobj={} window.οnerrοr=function(){return false} window.oDel=function(obj){if($(obj)!=null){$(obj).parentNode.removeChild($(obj))}} var domid=12 function on_ini(){ String.prototype.inc=function(s){return this.indexOf(s)>-1?true:false} var agent=navigator.userAgent window.isOpr=agent.inc("Opera") window.isIE=agent.inc("IE")&&!isOpr window.isMoz=agent.inc("Mozilla")&&!isOpr&&!isIE if(isMoz){ Event.prototype.__defineGetter__("x",function(){return this.clientX+2}) Event.prototype.__defineGetter__("y",function(){return this.clientY+2}) Event.prototype.__defineGetter__("srcElement",function(){var node=this.target;while(node.nodeType!=1){node=node.parentNode}return node}) } basic_ini() }//欢迎来到站长特效网,我们的网址是www.zzjs. net,很好记,zz站长,js就是js特效,.net打造靓站,还有许多广告代码下载。 function basic_ini(){ window.$=function(obj){return typeof(obj)=="string"?document.getElementById(obj):obj} window.oDel=function(obj){if($(obj)!=null){$(obj).parentNode.removeChild($(obj))}} } window.οnlοad=function(){ on_ini() var o=document.getElementsByTagName("h1") for(var i=0;i<o.length;i++){ o[i].οnmοusedοwn=addevent } }//欢迎来到站长特效网,我们的网址是www.zzjs .net,很好记,zz站长,js就是js特效,.net打造靓站,还有许多广告代码下载。 function addevent(e){ if(dragobj.o!=null) return false e=e||event var ee=e.srcElement if(ee.tagName=="FONT") return dragobj.o=this.parentNode dragobj.xy=getxy(dragobj.o) dragobj.xx=new Array((e.x-dragobj.xy[1]),(e.y-dragobj.xy[0])) dragobj.o.style.width=dragobj.xy[2]+"px" dragobj.o.style.height=dragobj.xy[3]+"px" dragobj.o.style.left=(e.x-dragobj.xx[0])+"px" dragobj.o.style.top=(e.y-dragobj.xx[1])+"px" dragobj.o.style.position="absolute" var om=document.createElement("div") dragobj.otemp=om om.style.width=dragobj.xy[2]+"px" om.style.height=dragobj.xy[3]+"px" dragobj.o.parentNode.insertBefore(om,dragobj.o) return false }//欢迎来到站长特效网,我们的网址是www.z zjs.net,很好记,zz站长,js就是js特效,.net打造靓站,还有许多广告代码下载。 document.onselectstart=function(){return false} window.οnfοcus=function(){document.onmouseup()} window.οnblur=function(){document.onmouseup()} document.οnmοuseup=function(){ if(dragobj.o!=null){ dragobj.o.style.width="auto" dragobj.o.style.height="auto" dragobj.otemp.parentNode.insertBefore(dragobj.o,dragobj.otemp) dragobj.o.style.position="" oDel(dragobj.otemp) dragobj={} } }//欢迎来到站长特效网,我们的网址是www. zzjs.net,很好记,zz站长,js就是js特效,.net打造靓站,还有许多广告代码下载。 document.οnmοusemοve=function(e){ e=e||event if(dragobj.o!=null){ dragobj.o.style.left=(e.x-dragobj.xx[0])+"px" dragobj.o.style.top=(e.y-dragobj.xx[1])+"px" createtmpl(e) } } function getxy(e){ var a=new Array() var t=e.offsetTop; var l=e.offsetLeft; var w=e.offsetWidth; var h=e.offsetHeight; while(e=e.offsetParent){ t+=e.offsetTop; l+=e.offsetLeft; } a[0]=t;a[1]=l;a[2]=w;a[3]=h return a; }//欢迎来到站长特效.网,我们的网址是www.zzjs.net,很好记,zz站长,js就是js特效,.net打造靓站,还有许多广告代码下载。 function inner(o,e){ var a=getxy(o) if(e.x>a[1]&&e.x<(a[1]+a[2])&&e.y>a[0]&&e.y<(a[0]+a[3])){ if(e.y<(a[0]+a[3]/2)) return 1; else return 2; }else return 0; }//欢迎来到站长特.效网,我们的网址是www.zzjs.net,很好记,zz站长,js就是js特效,.net打造靓站,还有许多广告代码下载。 function createtmpl(e){ for(var i=0;i<domid;i++){ if(!$("m"+i)) continue if($("m"+i)==dragobj.o) continue var b=inner($("m"+i),e) if(b==0) continue dragobj.otemp.style.width=$("m"+i).offsetWidth if(b==1){ $("m"+i).parentNode.insertBefore(dragobj.otemp,$("m"+i)) }else{ if($("m"+i).nextSibling==null){ $("m"+i).parentNode.appendChild(dragobj.otemp) }else{ $("m"+i).parentNode.insertBefore(dragobj.otemp,$("m"+i).nextSibling) } } return } for(var j=0;j<3;j++){ if($("dom"+j).innerHTML.inc("div")||$("dom"+j).innerHTML.inc("DIV")) continue var op=getxy($("dom"+j)) if(e.x>(op[1]+10)&&e.x<(op[1]+op[2]-10)){ $("dom"+j).appendChild(dragobj.otemp) dragobj.otemp.style.width=(op[2]-10)+"px" } } }//欢迎来到站长.特效网,我们的网址是www.zzjs.net,很好记,zz站长,js就是js特效,.net打造靓站,还有许多广告代码下载。 function add_div() { var o=document.createElement("div") o.className="mo" o.id="m"+domid $('dom0').appendChild(o) o.innerHTML="<h1><span>站长特效"+domid+"</span><font οnclick='del_div(this)'>x</font></h1><div class=nr>站长特效提示:新添加的</div>" o.getElementsByTagName("h1")[0].οnmοusedοwn=addevent domid++ } function del_div(obj){alert(obj.parentNode.parentNode.innerHTML); var o=obj.parentNode.parentNode oDel(o) }//欢迎来到站.长特效网,我们的网址是www.zzjs.net,很好记,zz站长,js就是js特效,.net打造靓站,还有许多广告代码下载。 function mov(){ document.getElementById("bar").style.display="none"; } function show(){ document.getElementById("bar").style.display=""; }//欢迎来到站长特效网,我们的网址是www.zzjs.net,很好记,zz站长,js就是js特效,.net打造靓站,还有许多广告代码下载。 // --></mce:script> </head> <body> <a href="http://www.zzjs.net/" mce_href="http://www.zzjs.net/">站长特效网</a>,站长必备的高质量网页特效和广告代码。zzjs.net,站长js特效。<hr> <!--欢迎来到站长特效网,我们网站收集大量高质量js特效,提供许多广告代码下载,网址:www.zzjs.net,zzjs@msn.com,用.net打造靓站--> <div id="bar" style="height:400px;background:#eee;">站长特效网,高质量网页特效代码,打造一流网页特效站!</div> <input type="button" value="移除上面模块" οnclick="mov();"><input type="button" value="添加顶部模块" οnclick="show();"><input type="button" value="添加DIV" οnclick="add_div();"> <div class=content> <div class="left" id="dom0"> <div class="mo" id="m0"><h1><span>站长特效一号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> <div class="mo" id="m1"><h1><span>站长特效二号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> <div class="mo" id="m2"><h1><span>站长特效三号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> <div class="mo" id="m3"><h1><span>站长特效四号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> </div> <div class="center" id="dom1"> <div class="mo" id="m4"><h1><span>站长特效五号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> <div class="mo" id="m5"><h1><span>站长特效六号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> <div class="mo" id="m6"><h1><span>站长特效七号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> <div class="mo" id="m7"><h1><span>站长特效八号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> </div> <div class="right" id="dom2"> <div class="mo" id="m8"><h1><span>站长特效九号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> <div class="mo" id="m9"><h1><span>站长特效十号</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> <div class="mo" id="m10"><h1><span>站长特效十一</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> <div class="mo" id="m11"><h1><span>站长特效十二</span><font οnclick="del_div(this)">x</font></h1><div class="nr"></div></div> </div> </div> </body> </html>