javascript 拖动_cookie_ajax等

<!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=gb2312" /> <title>新版本网站--lib类函数功能应用DEMO演示</title> <script language="javascript" type="text/javascript"> <!-- Com=window.Com||{}; Com.Common={ isIE6:function(){return navigator.userAgent.search('MSIE')>0&&navigator.userAgent.search('6')>0;}, isIE:function(){return navigator.userAgent.search('MSIE')>0;}, isOpera:function(){return navigator.userAgent.indexOf('Opera')>-1;}, isMoz:function(){return navigator.userAgent.indexOf('Mozilla/5.')>-1;}, LTrim:function(i){return i.replace(/^\s*/,"");}, RTrim:function(i){return i.replace(/\s*$/,"");}, Trim:function(i){return this.rTrim(this.lTrim(i));}, $:function(i){ if(!document.getElementById)return false; if(typeof i==="string"){ if(document.getElementById && document.getElementById(i)) {// W3C DOM return document.getElementById(i); } else if (document.all && document.all(i)) {// MSIE 4 DOM return document.all(i); } else if (document.layers && document.layers[i]) {// NN 4 DOM.. note: this won't find nested layers return document.layers[i]; } else { return false; } } else{return i;} }, getElByClassName:function(tag,name,size,el){ var el=(el)?el:document; var itm=el.getElementsByTagName(tag); var num=1; for(i=0;i<itm.length;i++){ if(itm[i].className===name&&size===num){ return itm[i]; } else if(itm[i].className===name){ num++; } } return false; }, insertAfter:function(newElement,targetElement){ var parent = targetElement.parentNode; if(parent.lastChild == targetElement){ parent.appendChild(newElement); } else{ parent.insertBefore(newElement,targetElement.nextSibling); } }, liveClock:function(){ // Set the text to display before the clock: var mypre_text = "当前时间:"; // Display the time in 24 or 12 hour time? // 0 = 24, 1 = 12 var my12_hour = 1; // How often do you want the clock updated? // 0 = Never, 1 = Every Second, 2 = Every Minute // If you pick 0 or 2, the seconds will not be displayed var myupdate = 1; // Display the date? // 0 = No, 1 = Yes var DisplayDate = 1; // Global varibale definitions: var dn=""; // The following arrays contain data which is used in the clock's // date function. Feel free to change values for Days and Months // if needed (if you wanted abbreviated names for example). var DaysOfWeek = new Array(7); DaysOfWeek[0] = "星期日"; DaysOfWeek[1] = "星期一"; DaysOfWeek[2] = "星期二"; DaysOfWeek[3] = "星期三"; DaysOfWeek[4] = "星期四"; DaysOfWeek[5] = "星期五"; DaysOfWeek[6] = "星期六"; var MonthsOfYear = new Array(12); MonthsOfYear[0] = "1"; MonthsOfYear[1] = "2"; MonthsOfYear[2] = "3"; MonthsOfYear[3] = "4"; MonthsOfYear[4] = "5"; MonthsOfYear[5] = "6"; MonthsOfYear[6] = "7"; MonthsOfYear[7] = "8"; MonthsOfYear[8] = "9"; MonthsOfYear[9] = "10"; MonthsOfYear[10] = "11"; MonthsOfYear[11] = "12"; // This array controls how often the clock is updated, // based on your selection in the configuration. var ClockUpdate = new Array(3); ClockUpdate[0] = 0; ClockUpdate[1] = 1000; ClockUpdate[2] = 60000; // Get all our date variables: var Digital = new Date(); var year = Digital.getYear(); var day = Digital.getDay(); var mday = Digital.getDate(); var month = Digital.getMonth(); var hours = Digital.getHours(); var minutes = Digital.getMinutes(); var seconds = Digital.getSeconds(); // Set up the hours for either 24 or 12 hour display: if(my12_hour){ dn = "AM"; if (hours > 12) { dn = "PM"; hours = hours - 12; } if (hours == 0) { hours = 12; } } else{ dn = ""; } if (minutes <= 9) { minutes = "0"+minutes; } if (seconds <= 9) { seconds = "0"+seconds; } if (year < 1000) {year += 1900; } // This is the actual HTML of the clock. If you're going to play around // with this, be careful to keep all your quotations in tact. myclock = ''; myclock += mypre_text; myclock += hours+':'+minutes; if ((myupdate < 2) || (myupdate == 0)) { myclock += ':'+seconds; } myclock += ' '+dn; if (DisplayDate){ myclock += ' ' + year + '年' + MonthsOfYear[month] + '月'+mday+'日' + ' ' + DaysOfWeek[day]; } if(!this.$("datetime")) return false; this.$("datetime").innerHTML = myclock; if(myupdate != 0){ setTimeout("Com.Common.liveClock('datetime')",ClockUpdate[myupdate]); } }, popNew:function(url,title,width,height){ var w = 1024; var h = 768; if (document.all || document.layers){ w = screen.availWidth; h = screen.availHeight; } var leftPos = (w/2-width/2); var topPos = (h/2.3-height/2.3); window.open(url,title,"width="+width+",height="+height+",top="+topPos+",left="+leftPos+",scrollbars=no,resizable=no,status=no") }, resetForm:function(whichForm){ if(!whichForm) return false; for(var i=0;i<whichForm.elements.length;i++){ var element = whichForm.elements[i]; if(!element.defaultValue || element.type == "submit" || element.type == "button" || element.type == "reset") continue; element.onfocus = function(){ if(this.value==this.defaultValue){ this.value = ""; } } element.onblur = function(){ if(this.value==""){ this.value = this.defaultValue; } } } }, xPos:function(element){ var positionX = 0; while(element != null){ positionX += element.offsetLeft; element = element.offsetParent; } return positionX; }, yPos:function(element){ var positionY = 0; while(element != null){ positionY += element.offsetTop; element = element.offsetParent; } return positionY; }, addClass:function(element,value){ if(!element.className){ element.className = value; } else{ var newClassName = element.className; newClassName += " "; newClassName += value; element.className = newClassName; } }, styleElementsSiblings:function(tag,theClass){ if(!document.getElementsByTagName) return false; var elems = document.getElementsByTagName(tag); for(var i=0;i<elems.length;i++){ var elem = elems[i]; this.addClass(elem,theClass); } }, stripeTables:function(clsName){ if(!document.getElementsByTagName) return false; var tables = document.getElementsByTagName("table"); for(var i=0;i<tables.length;i++){ var odd = false; var rows = tables[i].getElementsByTagName("tr"); for(var j=0;j<rows.length;j++){ if(odd == true){ this.addClass(rows[j],clsName); odd = false; } else{ odd = true; } } } }, highLightRows:function(clsName,tag){ if(!document.getElementsByTagName) return false; var rows = document.getElementsByTagName(tag); for(var i=0;i<rows.length;i++){ rows[i].oldClassName = rows[i].className; rows[i].onmouseover = function(){ Com.Common.addClass(this,clsName); } rows[i].onmouseout = function(){ this.className = this.oldClassName; } } } }; Com.Cookie={ setCookie:function(cn,cv,d,dm){ var now=new Date(); var expire=new Date(); if(d==null||d==0)d=1; expire.setTime(now.getTime()+3600000*24*d); document.cookie=cn+"="+escape(cv)+";expires="+expire.toGMTString()+";domain="+dm+"; path=/"; }, deleteCookie:function(cn,dm){ if(this.getCookie(name)){ document.cookie=cn+"="+((domain)?"; domain="+dm:"")+"; expires=Thu, 01-Jan-70 00:00:01 GMT"; } }, getCookie:function(cn){ var dc=document.cookie; var prefix=cn+"="; var begin=dc.indexOf("; "+prefix); if(begin==-1){ begin=dc.indexOf(prefix); if(begin!=0)return null; } else{ begin+=2; } var end=document.cookie.indexOf(";",begin); if(end==-1){end=dc.length;} return unescape(dc.substring(begin+prefix.length,end)); } }; Com.StringBuffer={ _strings_:new Array, Append:function(str){ this._strings_.push(str); }, toString:function(){ return this._strings_.join(""); } }; Com.Event={ addEvent:function(obj,evType,fn){ if(obj.addEventListener){ obj.addEventListener(evType,fn,false); return true; } else if(obj.attachEvent){ var r=obj.attachEvent("on"+evType,fn); Com.EventCache.add(obj,evType,fn); return r; } else{ return false; } }, removeEvent:function(obj,evType,fn){ if(obj.removeEventListener){ obj.removeEventListener(evType,fn,false); return true; } else if(obj.detachEvent){ var r=obj.detachEvent("on"+evType,fn); return r; } else{ return false; } }, getEvent:function(e){ e=window.event||e; e.leftButton=false; if(e.srcElement==null&&e.target!=null){ e.srcElement=e.target; e.leftButton=(e.button==1); } else if(e.target==null&&e.srcElement!=null){ e.target=e.srcElement; e.leftButton=(e.button==0); } else if(e.srcElement!=null&&e.target!=null){ } else{ return null } if(document.body&&document.documentElement){ e.mouseX=e.pageX||(e.clientX+Math.max(document.body.scrollLeft,document.documentElement.scrollLeft)); e.mouseY=e.pageY||(e.clientY+Math.max(document.body.scrollTop,document.documentElement.scrollTop)); } else{ e.mouseX=-1;e.mouseY=-1; } return e; }, stopEvent:function(e){ if(e&&e.cancelBubble!=null){ e.cancelBubble=true; e.returnValue=false; } if(e&&e.stopPropagation&&e.preventDefault){ e.stopPropagation(); e.preventDefault(); } return false; } }; Com.EventCache=function(){ var listEvents=[]; return{ listEvents:listEvents, add:function(node,sEventName,fHandler,bCapture){ listEvents[listEvents.length]=arguments; }, flush:function(){ var i,item; for(i=listEvents.length-1;i>=0;i=i-1){ item=listEvents[i]; if(item[0].removeEventListener){ item[0].removeEventListener(item[1],item[2],item[3]); }; if(item[1].substring(0,2)!="on"){ item[1]="on"+item[1]; }; if(item[0].detachEvent){ item[0].detachEvent(item[1],item[2]); }; item[0][item[1]]=null; }; } }; }(); Com.Event.addEvent(window,"unload",Com.EventCache.flush); function error_handler(a,b,c){ window.status=(c+"\n"+b+"\n\n"+a+"\n\n"+error_handler.caller); return true; } Com.Ajax={ useActiveX:function(){return (typeof ActiveXObject != "undefined");}, useDom:function(){return document.implementation && document.implementation.createDocument;}, useXmlHttp:function(){return (typeof XMLHttpRequest != "undefined");}, ARR_XMLHTTP_VERS : ["MSXML2.XmlHttp.6.0","MSXML2.XmlHttp.3.0"], ARR_DOM_VERS : ["MSXML2.DOMDocument.6.0","MSXML2.DOMDocument.3.0"], createXMLHTTPRequest:function(){ //if it natively supports XMLHttpRequest object if (this.useXmlHttp){ return new XMLHttpRequest(); } else if (this.useActiveX) { //IE < 7.0 = use ActiveX if (!this.XMLHTTP_VER) { for (var i=0; i < this.ARR_XMLHTTP_VERS.length; i++) { try { new ActiveXObject(this.ARR_XMLHTTP_VERS[i]); this.XMLHTTP_VER = this.ARR_XMLHTTP_VERS[i]; break; } catch (oError) { } } } if (this.XMLHTTP_VER) { return new ActiveXObject(this.XMLHTTP_VER); } else { throw new Error("Could not create XML HTTP Request."); } } else { throw new Error("Your browser doesn't support an XML HTTP Request."); } }, Updater:function(tarObj,URL,sMethod,parameters){ var oXmlHttp = this.createXMLHTTPRequest(); oXmlHttp.open(sMethod, URL+parameters, true); oXmlHttp.onreadystatechange = function () { if (oXmlHttp.readyState == 4) { if (oXmlHttp.status == 200 || window.location.href.indexOf("http")==-1) { if(Com.Common.$(tarObj)){ Com.Common.$(tarObj).innerHTML = oXmlHttp.responseText; } else{ return false; } } else { throw new Error("An error occurred."); } } } oXmlHttp.send(null); }, Request:function(sMethod,URL,parameters,func){ var oXmlHttp = this.createXMLHTTPRequest(); oXmlHttp.open(sMethod, URL+parameters, true); oXmlHttp.onreadystatechange = function() { if (oXmlHttp.readyState == 4) { if (oXmlHttp.status == 200 || window.location.href.indexOf("http")==-1) { return func(oXmlHttp); } else { throw new Error("An error occurred."); } } } oXmlHttp.send(null); } }; Com.AjaxTab={ setTabsEvent:function(){ for(var i=0;i<arguments.length;i++){ var tabs = Com.Common.$(arguments[i]); if(!tabs || !document.getElementsByTagName) return false; var theList = tabs.getElementsByTagName("li"); var theLink = tabs.getElementsByTagName("a"); for(var j=0;j<theList.length;j++){ var theTab = theList[j]; if(theTab.parentNode!=tabs) continue; var theA = theLink[j]; theA.onclick = function(){ return false; } theTab.onclick = function(){ var theClass = this.className; if(theClass!="current"){ var objId = this.getAttribute("id").split("_")[1]; var tarObj = this.getAttribute("id").split("_")[0]; var theURL = tarObj + "/" + tarObj + objId + ".htm"; var listElem = Com.Common.$(tarObj); Com.AjaxTab.chgTabStyle(listElem,objId,tarObj,theURL); return false; } } } } }, chgTabStyle:function(ListName,tabId,tarInject,URL){ if(!ListName || !document.getElementsByTagName) return false; var Tabs = ListName; var theLi = Tabs.getElementsByTagName("li"); for(var i=0;i<theLi.length;i++){ if(i==tabId){ theLi[tabId].className = "current"; this.showMsg(tarInject+"_cnt",URL); } else{ theLi[i].className = ""; } } }, showMsg:function(tagid,URL){ if(!Com.Common.$(tagid)) return false; var loadstatustext="正在加载内容, 请稍候... <img src='img/loading.gif' alt='正在加载内容, 请稍候...' />"; Com.Common.$(tagid).innerHTML = loadstatustext; var para = "?d=" + Math.random(); var myAjax = Com.Ajax.Updater(tagid,URL,"get",para); } }; Com.Drag = { obj : null, zIndex : 300, dragWidth : screen.availWidth-328, dragHeight : screen.availHeight-344, initDragDivs : function(handles,drags){ for(var i=0;i<arrHandle.length;i++){ var h = Com.Common.$(handles[i]); var d = Com.Common.$(drags[i]); this.init(h, d, 0, this.dragWidth, 0, this.dragHeight); } }, init : function(o, oRoot, minX, maxX, minY, maxY, bSwapHorzRef, bSwapVertRef, fXMapper, fYMapper) { if(!o || !oRoot) return false; o.setAttribute("title","^-^,按住我,可以拖动我哦!!!"); o.style.cursor = "move"; o.onmousedown= Com.Drag.start; o.hmode= bSwapHorzRef ? false : true ; o.vmode= bSwapVertRef ? false : true ; o.root = oRoot && oRoot != null ? oRoot : o ; o.root.onclick = function(){ o.root.style.zIndex = Com.Drag.zIndex; Com.Drag.zIndex++; } if (o.hmode && isNaN(parseInt(o.root.style.left ))) o.root.style.left = "0px"; if (o.vmode && isNaN(parseInt(o.root.style.top ))) o.root.style.top = "0px"; if (!o.hmode && isNaN(parseInt(o.root.style.right ))) o.root.style.right = "0px"; if (!o.vmode && isNaN(parseInt(o.root.style.bottom))) o.root.style.bottom = "0px"; o.minX= typeof minX != 'undefined' ? minX : null; o.minY= typeof minY != 'undefined' ? minY : null; o.maxX= typeof maxX != 'undefined' ? maxX : null; o.maxY= typeof maxY != 'undefined' ? maxY : null; o.xMapper = fXMapper ? fXMapper : null; o.yMapper = fYMapper ? fYMapper : null; o.root.onDragStart= new Function(); o.root.onDragEnd= new Function(); o.root.onDrag= new Function(); }, start : function(e) { var o = Com.Drag.obj = this; e = Com.Drag.fixE(e); Com.Drag.fixIndex(o); var y = parseInt(o.vmode ? o.root.style.top : o.root.style.bottom); var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right ); o.root.onDragStart(x,y); o.lastMouseX= e.clientX; o.lastMouseY= e.clientY; if (o.hmode) { if (o.minX != null)o.minMouseX= e.clientX - x + o.minX; if (o.maxX != null)o.maxMouseX= o.minMouseX + o.maxX - o.minX; } else { if (o.minX != null) o.maxMouseX = -o.minX + e.clientX + x; if (o.maxX != null) o.minMouseX = -o.maxX + e.clientX + x; } if (o.vmode) { if (o.minY != null)o.minMouseY= e.clientY - y + o.minY; if (o.maxY != null)o.maxMouseY= o.minMouseY + o.maxY - o.minY; } else { if (o.minY != null) o.maxMouseY = -o.minY + e.clientY + y; if (o.maxY != null) o.minMouseY = -o.maxY + e.clientY + y; } document.onmousemove= Com.Drag.drag; document.onmouseup= Com.Drag.end; return false; }, drag : function(e) { e = Com.Drag.fixE(e); var o = Com.Drag.obj; if(document.all){ o.root.style.filter = "alpha(opacity=50)"; } else{ o.root.style.opacity = 0.5; } var ey= e.clientY; var ex= e.clientX; var y = parseInt(o.vmode ? o.root.style.top : o.root.style.bottom); var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right ); var nx, ny; if (o.minX != null) ex = o.hmode ? Math.max(ex, o.minMouseX) : Math.min(ex, o.maxMouseX); if (o.maxX != null) ex = o.hmode ? Math.min(ex, o.maxMouseX) : Math.max(ex, o.minMouseX); if (o.minY != null) ey = o.vmode ? Math.max(ey, o.minMouseY) : Math.min(ey, o.maxMouseY); if (o.maxY != null) ey = o.vmode ? Math.min(ey, o.maxMouseY) : Math.max(ey, o.minMouseY); nx = x + ((ex - o.lastMouseX) * (o.hmode ? 1 : -1)); ny = y + ((ey - o.lastMouseY) * (o.vmode ? 1 : -1)); if (o.xMapper)nx = o.xMapper(y) else if (o.yMapper)ny = o.yMapper(x) Com.Drag.obj.root.style[o.hmode ? "left" : "right"] = nx + "px"; Com.Drag.obj.root.style[o.vmode ? "top" : "bottom"] = ny + "px"; Com.Drag.obj.lastMouseX= ex; Com.Drag.obj.lastMouseY= ey; Com.Drag.obj.root.onDrag(nx, ny); return false; }, end : function() { var o = Com.Drag.obj; document.onmousemove = document.onmouseup = function(){ if(document.all){ o.root.style.filter = ""; } else{ o.root.style.opacity = 1; } return null; } Com.Drag.obj.root.onDragEnd(parseInt(Com.Drag.obj.root.style[Com.Drag.obj.hmode ? "left" : "right"]), parseInt(Com.Drag.obj.root.style[Com.Drag.obj.vmode ? "top" : "bottom"])); Com.Drag.obj = null; }, fixE : function(e) { if (typeof e == 'undefined') e = window.event; if (typeof e.layerX == 'undefined') e.layerX = e.offsetX; if (typeof e.layerY == 'undefined') e.layerY = e.offsetY; return e; }, fixIndex : function(elem){ elem.root.style.zIndex = Com.Drag.zIndex; Com.Drag.zIndex++; } }; Com.Skin={ setChgEvent:function(obj){ var ul = Com.Common.$(obj); if(!ul || !document.getElementsByTagName) return false; var tabs = ul.getElementsByTagName("img"); for(var i=0;i<tabs.length;i++){ tabs[i].onclick = function(){ var styleName = this.getAttribute("id")+" style"; Com.Skin.setActiveStyleSheet(styleName,1); return false; } } }, setActiveStyleSheet:function(title){ var i, a, main; for(i=0; (a = document.getElementsByTagName("link")[i]); i++) { if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) { a.disabled = true; if(a.getAttribute("title") == title) a.disabled = false; } } }, getActiveStyleSheet:function(){ var i, a; for(i=0; (a = document.getElementsByTagName("link")[i]); i++) { if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title"); } return null; }, getPreferredStyleSheet:function() { var i, a; for(i=0; (a = document.getElementsByTagName("link")[i]); i++) { if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("rel").indexOf("alt") == -1 && a.getAttribute("title") ) return a.getAttribute("title"); } return null; }, setDefautlStyle:function(){ var cookie = Com.Cookie.getCookie("style"); var title = cookie ? cookie : this.getPreferredStyleSheet(); this.setActiveStyleSheet(title); }, setSkinCookie:function(e){ var title = this.getActiveStyleSheet(); Com.Cookie.setCookie("style", title, 365, ""); } }; //--> </script> <style type="text/css"> <!-- *{margin:0;padding:0;} body{text-align:center;background-color:#FFF;font:normal 12px Georgia, "Times New Roman", Times, Arial, Helvetica, sans-serif;color:#000;} form,div,span,ul,li,p,h1,h2,h3,h4,h5,h6{text-align:left;padding:5px;} a:link,a:visited{color:#000;text-decoration:none;}a:hover{color:#F00;text-decoration:underline;} h1{font-size:16px;} img{border:0;} ul,li{list-style-type:none;} dl,dd{clear:both;} .bgGray{background-color:#F1F1F1;} .clear{clear:both;visibility:hidden;font-size:1px;width:1px;height:1px;} #title{position:absolute;top:30px;left:20px;} .drag{position:absolute;z-index:200;top:300px;left:300px;width:300px;height:200px;padding:3px;border:1px solid #999;overflow:hidden;background-color:#FFF;} .handle{margin:0 auto;width:294px;height:14px;padding:3px;background-color:#F1F1F1;overflow:hidden;border-bottom:1px solid #999;} .handle h2{float:left;width:140px;height:12px;font-size:12px;color:#000;padding:1px 0 1px 4px;overflow:hidden;} .handle span{float:right;width:60px;text-align:center;height:12px;font-size:12px;padding:1px 0 1px 0;overflow:hidden;} .drag ul{ float:left; width:300px; height:23px; padding:0; overflow:hidden; } .drag li{ float:left; display:inline; width:100px; height:12px; padding:4px 0 6px 0; border-bottom:1px solid #CCC; overflow:hidden; text-align:center; } .drag li.current{ background-color:#F1F1F1; font-weight:bold; color:#FFF; } .cnt{ margin:0 auto; margin-top:4px; width:288px; height:165px; overflow:auto; scrollbar-arrow-color:#666; /*上下按钮上三角箭头的颜色*/ scrollbar-base-color:#ccc;/*滚动条的基本颜色*/ scrollbar-dark-shadow-color:#fff;/*立体滚动条强阴影的颜色*/ scrollbar-face-color:#ccc;/*立体滚动条凸出部分的颜色*/ scrollbar-highlight-color:#fff;/*滚动条空白部分的颜色*/ scrollbar-shadow-color:#fff;/*立体滚动条阴影的颜色*/ } #tabs_cnt{height:142px;} .cnt p{margin:0 auto;width:260px;height:auto;padding:3px 0 8px 0;line-height:130%;font-size:12px;} .cnt p:first-letter{ float:left; padding:0 2px 0 2px; color:#403C31; font:bold 28px "楷体_GB2312","微软雅黑"; } --> </style> </head> <body> <script language="javascript" type="text/javascript"> <!-- var arrHandle = ["handle","handle1","handle2","handle3"]; var arrDrag = ["drag","drag1","drag2","drag3"]; function displayDiv(flg,elemID){ Com.Common.$(elemID).style.display=flg==0?"block":"none"; } function displayAllDiv(){ for(var i=0;i<arrDrag.length;i++){ Com.Common.$(arrDrag[i]).style.display="block"; } } alert("你的浏览器是否为IE6:"+Com.Common.isIE6()); //--> </script> <h1 id="title">新版本网站--lib类函数功能应用DEMO演示</h1> <script language="javascript" type="text/javascript"> <!-- alert("通过Com.Common.$('tagId')获得title节点为:"+Com.Common.$("title")); alert("标题[title]的X坐标为:"+Com.Common.xPos(Com.Common.$("title"))); //--> </script> <span id="container"> 1 2 3 4 5 6 7 8 </span> <script language="javascript" type="text/javascript"> <!-- var tags = Com.Common.getElByClassName("div","main",5,Com.Common.$("container")); alert("通过Com.Common.getElByClassName()方法得到第5个div标签的class='main'的内容为:"+tags.innerHTML); //Com.Common.styleElementsSiblings("div","bgGray"); Com.Common.highLightRows("bgGray","div"); var elem = document.createElement("p"); elem.innerHTML="19.95"; Com.Common.insertAfter(elem,Com.Common.$("container")); //--> </script> <script language="javascript" type="text/javascript"> <!-- Com.Common.liveClock(); //--> </script> <form name="frmDemo" id="frmDemo" action="" method="post"> <input type="text" name="txtWord" id="txtWord" value="请输入要搜索的关键字" /> <input type="button" name="btnEnter" id="btnEnter" onclick="displayAllDiv();" value="显示拖动窗口" /> </form> <script language="javascript" type="text/javascript"> <!-- Com.Common.resetForm(Com.Common.$("frmDemo")); Com.Common.addClass(Com.Common.$("frmDemo"),"bgGray"); Com.StringBuffer.Append("hello "); Com.StringBuffer.Append("world"); alert(Com.StringBuffer.toString()); //--> </script> <h2>拖动窗口(1)</h2><span><a href="#" title="关闭窗口" onclick="displayDiv(1,'drag')">关闭窗口</a></a></span><br class="clear" /> <p> 理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完善的一款产品,轻巧的机身,7.1倍光学变焦镜头,大尺寸LCD,快速的开机、对焦速度,加上合理的价格,取得了相当不错的销售成绩。 </p> <p> 08年2月19日,理光官方正式发布了R7的最新替代产品-R8,不到三天,这款新一代全能DC就已经上市,其售价为2880元,并赠送1GB SD卡一张。 </p> <p> 理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完善的一款产品,轻巧的机身,7.1倍光学变焦镜头,大尺寸LCD,快速的开机、对焦速度,加上合理的价格,取得了相当不错的销售成绩。 </p> <p> 08年2月19日,理光官方正式发布了R7的最新替代产品-R8,不到三天,这款新一代全能DC就已经上市,其售价为2880元,并赠送1GB SD卡一张。 </p> <h2>Ajax标签导航窗口(2)</h2><span><a href="#" title="关闭窗口" onclick="displayDiv(1,'drag1')">关闭窗口</a></a></span><br class="clear" /> <ul id="tabs"> <li class="current" id="tabs_0"><a href="#1">Dom 编程艺术</a></li> <li id="tabs_1"><a href="#1">Ajax实战</a></li> <li id="tabs_2"><a href="#1">CSS权威指南</a></li> </ul><br class="clear" /> <p> DOM理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完善的一款产品,轻巧的机身,7.1倍光学变焦镜头,大尺寸LCD,快速的开机、对焦速度,加上合理的价格,取得了相当不错的销售成绩。 </p> <p> 08年2月19日,理光官方正式发布了R7的最新替代产品-R8,不到三天,这款新一代全能DC就已经上市,其售价为2880元,并赠送1GB SD卡一张。 </p> <p> 理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完善的一款产品,轻巧的机身,7.1倍光学变焦镜头,大尺寸LCD,快速的开机、对焦速度,加上合理的价格,取得了相当不错的销售成绩。 </p> <p> 08年2月19日,理光官方正式发布了R7的最新替代产品-R8,不到三天,这款新一代全能DC就已经上市,其售价为2880元,并赠送1GB SD卡一张。 </p> <h2>拖动窗口(3)</h2><span><a href="#" title="关闭窗口" onclick="displayDiv(1,'drag2')">关闭窗口</a></a></span><br class="clear" /> <p> 理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完善的一款产品,轻巧的机身,7.1倍光学变焦镜头,大尺寸LCD,快速的开机、对焦速度,加上合理的价格,取得了相当不错的销售成绩。 </p> <p> 08年2月19日,理光官方正式发布了R7的最新替代产品-R8,不到三天,这款新一代全能DC就已经上市,其售价为2880元,并赠送1GB SD卡一张。 </p> <p> 理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完善的一款产品,轻巧的机身,7.1倍光学变焦镜头,大尺寸LCD,快速的开机、对焦速度,加上合理的价格,取得了相当不错的销售成绩。 </p> <p> 08年2月19日,理光官方正式发布了R7的最新替代产品-R8,不到三天,这款新一代全能DC就已经上市,其售价为2880元,并赠送1GB SD卡一张。 </p> <h2>Ajax标签导航窗口(4)</h2><span><a href="#" title="关闭窗口" onclick="displayDiv(1,'drag3')">关闭窗口</a></a></span><br class="clear" /> <ul id="news"> <li class="current" id="news_0"><a href="#1">Dom 编程艺术</a></li> <li id="news_1"><a href="#1">Ajax实战</a></li> <li id="news_2"><a href="#1">CSS权威指南</a></li> </ul><br class="clear" /> <p> 理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完善的一款产品,轻巧的机身,7.1倍光学变焦镜头,大尺寸LCD,快速的开机、对焦速度,加上合理的价格,取得了相当不错的销售成绩。 </p> <p> 08年2月19日,理光官方正式发布了R7的最新替代产品-R8,不到三天,这款新一代全能DC就已经上市,其售价为2880元,并赠送1GB SD卡一张。 </p> <p> 理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完善的一款产品,轻巧的机身,7.1倍光学变焦镜头,大尺寸LCD,快速的开机、对焦速度,加上合理的价格,取得了相当不错的销售成绩。 </p> <p> 08年2月19日,理光官方正式发布了R7的最新替代产品-R8,不到三天,这款新一代全能DC就已经上市,其售价为2880元,并赠送1GB SD卡一张。 </p> <script language="javascript" type="text/javascript"> <!-- Com.Drag.initDragDivs(arrHandle,arrDrag); Com.AjaxTab.setTabsEvent("tabs","news"); //--> </script> </body> </html>

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

时间: 2024-09-20 05:50:15

javascript 拖动_cookie_ajax等的相关文章

javascript 拖动_cookie_ajax等_AJAX相关

新版本网站--lib类函数功能应用DEMO演示 1 2 3 4 5 6 7 8 拖动窗口(1) 关闭窗口 理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完善的一款产品,轻巧的机身,7.1倍光学变焦镜头,大尺寸LCD,快速的开机.对焦速度,加上合理的价格,取得了相当不错的销售成绩. 08年2月19日,理光官方正式发布了R7的最新替代产品-R8,不到三天,这款新一代全能DC就已经上市,其售价为2880元,并赠送1GB SD卡一张. 理光R系列自来都已全面而著称,去年推出的R7则堪称是相当完

利用javascript移动div层-javascript 拖动层_javascript技巧

利用javascript移动div层-javascript 拖动层: 程序功能:利用javascript开发在界面上随意拖动以下html code中的div层. javascript移动div层-javascript 拖动层代码-html code: 复制代码 代码如下: <div id="div_Info" style="display: none; dz-index: 101; left: 175px; width: 650px; position: absolut

javascript 拖动表格行实现代码_javascript技巧

行拖动的实现思路非常简单,选中一行,往上拖就与上面的行交换位置,往下拖就与下面的行交换位置.问题是如何得到交换行.我见过一个非常详细的教程,它会把表格里的每一行的高度与Y坐标计算出来,换言之,都时是比较e.pageX是否在[rowTop,rowBottom]区间之内.但这也带来第二个问题,有多少行就有多个这样的区间.于是解法就变成取事件源对象,然后再往上取其父对象,如果其父对象是TR元素,就取其[rowTop,rowBottom]区间....思路非常直接,同时也客观做出一个限制--不能使用代理拖

javascript拖动(拖拽)之我见 - 简约版

javascript RT,拖动可能是时下比较流行的一个js效果之一,在感叹创造者的神奇之外,我怀作好奇,也来尝试了一把(当然,是在欣赏了不少拖动代码的基础上,并妄想通过最简单的办法实现). 其实,拖动特效可以由3个主要部分组成,开始拖动,拖动,结束拖动. 哎,不说这么多了(摄影的朋友肯定要说, 怎么还不上图了...呵呵),好,我就来点代码吧. 开始拖动之前,先上2个简单的工具方法:  1   var  Utils  =    { 2     " getTarget " : funct

Javascript 拖动效果兼容火狐

鼠标拖动层封装类 效果预览 拖动层1     移动层 拖动层2     移动层 源代码 function dragClass(){ this.mouseState = document.all ? 1 : 0 ; this.x; this.y; this.dragId = null; this.index = 100; document.onselectstart = function(){return false;}; } dragClass.prototype = { dragStar:fu

比较精简的Javascript拖动效果函数代码_javascript技巧

div1:我可以被拖动 div2:来拖我呀 div3:我随便你拖 div4:我可以随窗口滑动,把我拖到最下面,然后滚动网页看看 作者: Longbill www.longbill.cn 参数说明: drag(obj [,scroll]); obj:对象的id或对象本身; scroll(可选):对象是否随窗口拖动而滑动,默认为否 鼠标右键查看源代码

JavaScript简单的鼠标拖动实例:自动吸附实例

文章简介:JavaScript鼠标拖动+自动吸附实例. 学了几天的JavaScript,自己动手做了一个简单的鼠标拖动的实例,拖动过程中科自动检测与目标容器的距离,在一定的距离范围内可以自动将被拖动的元素加入到目标容器中,希望对开始学习javascript的童鞋有用-- 先看看效果图(Chrome.FireFox.Opera.Safari.IE9测试通过): 效果图(虚线框:目标对象 蓝色填充透明框:临时拖动对象 红色填充框:被拖动对象) 主要思路:首先给要拖动的div添加一个鼠标按下(mous

javascript实现炫酷的拖动分页

  非常酷的javascript拖动分页功能,无缝循环分页,拖动鼠标即可完成分页,鼠标向左拖动回到前一页,向右拖动则翻开第二页,还带有动画特效,着实很不错,界面黑色,非主流风格,相信很多人会喜欢的. javascript实现炫酷的拖动分页 js ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45

javascript实现炫酷的拖动分页_javascript技巧

javascript实现炫酷的拖动分页 js <html> <head> <title>拖动分页</title> <meta http-equiv=content-type content="text/html; charset=gb2312"> <style> body{ border:0px; margin:0px; overflow:hidden; background-color:transparent;