复制代码 代码如下: ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www.w3.org/1999/xhtml"> Table <br /> body{margin:0px; padding:0px; font-size:12px}<br /> .div{height:160px;width:160px;position:absolute; text-align:center; }<br /> .demo1{ border:1px solid #96C2F1;background-color:#EFF7FF;left:150px;top:20px}<br /> .demo2{ border:1px solid #9BDF70;background-color:#F0FBEB;left:450px;top:20px}<br /> .demo3{ border:1px solid #BBE1F1;background-color:#EEFAFF;left:750px;top:20px}<br /> .demo4{ border:1px solid #96C2F1;background-color:#EEFAFF;left:150px;top:220px}<br /> .demo5{ border:1px solid #FFCC00;background-color:#FFFFF7;left:450px;top:220px}<br /> .demo6{ border:1px solid #E3E197;background-color:#FFFFDD;left:750px;top:220px}<br /> .demo7{ border:1px solid #ADCD3C;background-color:#F2FDDB;left:150px;top:420px}<br /> .demo8{ border:1px solid #F8B3D0;background-color:#FFF5FA;left:450px;top:420px}<br /> .demo9{ border:1px solid #D3D3D3;background-color:#F7F7F7;left:750px;top:420px}<br /> .focus{background-color: #990000;}<br /> demo1 demo2 demo3 demo4 demo5 demo6 demo7 demo8 demo9 <br /> (function(window,undefined){<br /> window.Sys = function (ua){<br /> var b = {<br /> ie: /msie/.test(ua) && !/opera/.test(ua),<br /> opera: /opera/.test(ua),<br /> safari: /webkit/.test(ua) && !/chrome/.test(ua),<br /> firefox: /firefox/.test(ua),<br /> chrome: /chrome/.test(ua)<br /> },vMark = "";<br /> for (var i in b) {<br /> if (b[i]) { vMark = "safari" == i ? "version" : i; break; }<br /> }<br /> b.version = vMark && RegExp("(?:" + vMark + ")[\\/: ]([\\d.]+)").test(ua) ? RegExp.$1 : "0";<br /> b.ie6 = b.ie && parseInt(b.version, 10) == 6;<br /> b.ie7 = b.ie && parseInt(b.version, 10) == 7;<br /> b.ie8 = b.ie && parseInt(b.version, 10) == 8; <br /> return b;<br /> }(window.navigator.userAgent.toLowerCase()); <p>window.Sys.ie6&&document.execCommand("BackgroundImageCache", false, true); <p>window.$ = function(Id){<br /> return document.getElementById(Id);<br /> };<br /> window.addListener = function(element,e,fn){<br /> !element.events&&(element.events = {});<br /> element.events[e]&&(element.events[e][addListener.guid++]=fn)||(element.events[e] = {'0':fn});<br /> element.addEventListener?element.addEventListener(e,fn,false):element.attachEvent("on" + e,fn);<br /> };<br /> window.addListener.guid = 1;<br /> window.removeListener = function(element,e,fn){<br /> var handlers = element.events[e],type;<br /> if(fn){<br /> for(type in handlers)<br /> if(handlers[type]===fn){<br /> element.removeEventListener?element.removeEventListener(e,fn,false):element.detachEvent("on" + e,fn);<br /> delete handlers[type];<br /> }<br /> }else{<br /> for(type in handlers){<br /> element.removeEventListener?element.removeEventListener(e,handlers[type],false):element.detachEvent("on" + e,handlers[type]);<br /> delete handlers[type];<br /> }<br /> } <br /> };<br /> window.setStyle = function(e,o){<br /> if(typeof o=="string")<br /> e.style.cssText=o;<br /> else <br /> for(var i in o)<br /> e.style[i] = o[i];<br /> }; <p>var slice = Array.prototype.slice; <br /> window.Bind = function(object, fun) {<br /> var args = slice.call(arguments).slice(2);<br /> return function() {<br /> return fun.apply(object, args);<br /> };<br /> };<br /> window.BindAsEventListener = function(object, fun,args) {<br /> var args = slice.call(arguments).slice(2);<br /> return function(event) {<br /> return fun.apply(object, [event || window.event].concat(args));<br /> }<br /> };<br /> //copy from jQ<br /> window.extend = function(){<br /> var target = arguments[0] || {}, i = 1, length = arguments.length, deep = true, options;<br /> if ( typeof target === "boolean" ) {<br /> deep = target;<br /> target = arguments[1] || {};<br /> i = 2;<br /> }<br /> if ( typeof target !== "object" && Object.prototype.toString.call(target)!="[object Function]")<br /> target = {};<br /> for(;i<length;i++){<br /> if ( (options = arguments[ i ]) != null )<br /> for(var name in options){<br /> var src = target[ name ], copy = options[ name ];<br /> if ( target === copy )<br /> continue;<br /> if ( deep && copy && typeof copy === "object" && !copy.nodeType ){<br /> target[ name ] = arguments.callee( deep, src || ( copy.length != null ? [ ] : { } ), copy );<br /> } <br /> else if(copy !== undefined)<br /> target[ name ] = copy; <br /> }<br /> }<br /> return target; <br /> };<br /> //copy from jQ<br /> window.each = function ( object, callback, args ) { <br /> var name, i = 0, length = object.length; <br /> if ( args ) {<br /> args = Array.prototype.slice.call(arguments).slice(2);<br /> if ( length === undefined ) { <br /> for ( name in object ) <br /> if ( callback.apply( object[ name ],[name,object[ name ]].concat(args) ) === false ) <br /> break; <br /> } else <br /> for ( ; i < length; i++) <br /> if ( callback.apply( object[ i ],[i,object[ i ]].concat(args)) === false ) //<br /> break; <br /> } else { <br /> if ( length === undefined ) { <br /> for ( name in object ) <br /> if ( callback.call( object[ name ], name, object[ name ] ) === false ) <br /> break; <br /> } else <br /> for ( var value = object[0]; <br /> i < length && callback.call( value, i, value ) !== false; value = object[++i] ){} <br /> } <br /> return object; <br /> }; <br /> window.currentStyle = function(element){<br /> return element.currentStyle || document.defaultView.getComputedStyle(element, null);<br /> };<br /> window.objPos = function(elem){<br /> var left = 0, top = 0, right = 0, bottom = 0,doc = elem ? elem.ownerDocument : document;<br /> if ( !elem.getBoundingClientRect || window.Sys.ie8 ) {<br /> var n = elem;<br /> while (n) { left += n.offsetLeft, top += n.offsetTop; n = n.offsetParent; };<br /> right = left + elem.offsetWidth; bottom = top + elem.offsetHeight;<br /> } else {<br /> var rect = elem.getBoundingClientRect();<br /> left = right = doc.documentElement.scrollLeft || doc.body.scrollLeft;<br /> top = bottom = doc.documentElement.scrollLeft || doc.body.scrollLeft;<br /> left += rect.left; right += rect.right;<br /> top += rect.top; bottom += rect.bottom;<br /> }<br /> return { "left": left, "top": top, "right": right, "bottom": bottom }; <br /> };<br /> window.hasClass = function(element, className){<br /> return element.className.match(new RegExp('(<a href="file://\\s|^)'+className+'(\\s|$)'">\\s|^)'+className+'(\\s|$)'));<br /> };<br /> window.addClass = function(element, className){<br /> !window.hasClass(element, className)&&(element.className += " "+className);<br /> };<br /> window.removeClass = function(element, className){<br /> window.hasClass(element, className)&&(element.className = element.className.replace(new RegExp('(<a href="file://\\s|^)'+className+'(\\s|$)'),'">\\s|^)'+className+'(\\s|$)'),' '));<br /> }<br /> })(window); <p>var Drag = {<br /> elem : null,<br /> zindex : 0,<br /> options : {},<br /> init : function(){ <br /> each(arguments,function(i,elem,oThis){<br /> addListener(elem,'mousedown',BindAsEventListener(oThis,oThis.start,elem));<br /> },this);<br /> },<br /> start : function(e,elem){<br /> var elem=this.elem = elem;<br /> elem.style.zIndex=++this.zindex;<br /> this.x = e.clientX - elem.offsetLeft ;<br /> this.y = e.clientY - elem.offsetTop;<br /> this.marginLeft = parseInt(currentStyle(elem).marginLeft)||0;<br /> this.marginTop = parseInt(currentStyle(elem).marginTop)||0;<br /> Sys.ie?elem.setCapture():e.preventDefault();<br /> addListener(document,"mousemove",BindAsEventListener(this,this.move));<br /> addListener(document,"mouseup",Bind(this,this.up)); <br /> this.options.callbackmove&&this.options.callbackmove(this.elem);<br /> },<br /> move : function(e){<br /> window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();<br /> var iLeft = e.clientX - this.x,iTop = e.clientY - this.y;obj = this.elem;<br /> obj.style.left = iLeft - this.marginLeft + "px";<br /> obj.style.top = iTop - this.marginTop + "px";<br /> this.options.callbackmove&&this.options.callbackmove(this.elem);<br /> },<br /> up : function(){<br /> removeListener(document,'mousemove');<br /> removeListener(document,'mouseup');<br /> Sys.ie&&this.elem.releaseCapture();<br /> this.options.callbackup&&this.options.callbackup(this.elem);<br /> }<br /> }; <p>var overlap = {<br /> hostel :{}, //