页面技术---js拖拽和DIV的层控制
一直想学习下J2EE中页面部分的相关技术，可是手头项目一直比较忙，所以没有去怎么样就，最近突然变得有空闲了，于是便自己做了个关于js拖拽和DIV的层控制，现在将代码贴上，请读者们多多指教：1.test.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"><html><head> <title>table</title> <LINK href="mytable.css" type=text/css rel=stylesheet> <SCRIPT src="test.js" type=text/javascript></SCRIPT><SCRIPT type=text/javascript></SCRIPT></head> <body> <DIV id=desktop_config><IMG id=img_all_resize title="全部 展开/折叠" onclick=resize_all() src="images/expand_arrow.png"></DIV><TABLE cellSpacing=0 cellPadding=0 width="100%" border=0><TBODY><TR> <TD id=col_l vAlign=top width="65%"> <DIV class="module listColor" id=module_13><DIV class=head ><H4 class=moduleHeader id=module_13_head><A class=expand href="javascript:_resize(13);"><IMG class=icon id=img_resize_13 title=折叠 src="images/expand_arrow.png"></A><SPAN class=text id=module_13_text onclick=_resize(13);>今日计划1</SPAN><SPAN class=title id=module_13_title style="CURSOR: move"></SPAN><SPAN class=close id=module_13_op><A class=PageLinkDisable id=module_13_link_pre title=上一页 href="javascript:nextPage('13',-1);"><B>▲</B></A> <A id=module_13_link_next title=下一页 href="javascript:nextPage('13',1);"><B>▼</B></A><A href="http://www.baidu.com">全部</A>&nbsp;<A title=设置 href="javascript:_edit(13);"><IMG src="images/pencil.png"></A>&nbsp;<A title=关闭模块 href="javascript:_del(13);"><IMG src="images/close_x.png"></A> </SPAN></H4></DIV><DIV class=module_body id=module_13_body><DIV class=module_div id=module_13_ul style="HEIGHT: 100px"><UL><LI>暂无工作计划<UL><SCRIPT>function plan_detail(PLAN_ID){URL='/general/work_plan/show/plan_detail.php?PLAN_ID='+PLAN_ID;myleft=(screen.availWidth-500)/2;window.open(URL,'read_work_plan','height=500,width=600,status=1,toolbar=no,menubar=no,location=no,scrollbars=yes,top=120,left='+myleft+',resizable=yes');}</SCRIPT></UL></LI></UL></marquee></DIV></DIV></DIV> <DIV class="module listColor" id=module_14><DIV class=head ><H4 class=moduleHeader id=module_14_head><A class=expand href="javascript:_resize(14);"><IMG class=icon id=img_resize_14 title=折叠 src="images/expand_arrow.png"></A><SPAN class=text id=module_14_text onclick=_resize(14);>今日计划2</SPAN><SPAN class=title id=module_14_title style="CURSOR: move"></SPAN><SPAN class=close id=module_14_op><A class=PageLinkDisable id=module_14_link_pre title=上一页 href="javascript:nextPage('14',-1);"><B>▲</B></A> <A id=module_14_link_next title=下一页 href="javascript:nextPage('14',1);"><B>▼</B></A><A href="http://www.baidu.com">全部</A>&nbsp;<A title=设置 href="javascript:_edit(14);"><IMG src="images/pencil.png"></A>&nbsp;<A title=关闭模块 href="javascript:_del(14);"><IMG src="images/close_x.png"></A> </SPAN></H4></DIV><DIV class=module_body id=module_14_body><DIV class=module_div id=module_14_ul style="HEIGHT: 100px"><UL><LI>暂无工作计划<UL><SCRIPT></SCRIPT></UL></LI></UL></DIV></DIV></DIV> <DIV name="fill"></DIV> </TD> <TD id=col_r style="PADDING-RIGHT: 10px" vAlign=top width="35%"> <DIV class="module listColor" id=module_23> <DIV class=head> <H4 class=moduleHeader id=module_23_head> <A class=expand href="javascript:_resize(23);"><IMG class=icon id=img_resize_23 title=折叠 src="images/expand_arrow.png"></A><SPAN class=text id=module_23_text onclick=_resize(23);>便签</SPAN><SPAN class=title id=module_23_title style="CURSOR: move"></SPAN><SPAN class=close id=module_23_op><A class=PageLinkDisable id=module_23_link_pre title=上一页 href="javascript:nextPage('23',-1);"><B>▲</B></A><A id=module_23_link_next title=下一页 href="javascript:nextPage('23',1);"><B>▼</B></A><A title=设置 href="javascript:_edit(23);"><IMG src="images/pencil.png"></A>&nbsp;<A title=关闭模块 href="javascript:_del(23);"><IMG src="images/close_x.png"></A> </SPAN></H4></DIV> <DIV class=module_body id=module_23_body> <DIV class=module_div id=module_23_ul style="HEIGHT: 100px"> <TEXTAREA id=note_1 onblur=saveNotes() style="BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 5px; OVERFLOW-Y: auto; PADDING-LEFT: 5px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #ffffcc; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 5px; WIDTH: 93%; PADDING-TOP: 5px; HEIGHT: 285px; BORDER-RIGHT-WIDTH: 0px"></TEXTAREA><SCRIPT language=JavaScript></SCRIPT> </DIV> </DIV> </DIV> <DIV name="fill"></DIV></TD> </TR> </TBODY> </TABLE> <SCRIPT type=text/javascript>_upc(2);</SCRIPT> <DIV id=overlay></DIV><DIV class="dialogBlock module" id=optionBlock style="DISPLAY: none; WIDTH: 300px"><H4 class=moduleHeader><SPAN class=title id=optionBlockTitle>模块选项</SPAN><A class=option href="javascript:hide_msg('optionBlock');"><IMG src="images/close.png"></A></H4><DIV class=module_body id=msgBody><DIV>&nbsp;&nbsp;显示的行数：<INPUT class=SmallInput id=display_lines size=5 value=5></DIV><DIV>&nbsp;&nbsp;<LABEL for=scroll>列表上下滚动显示</LABEL><INPUT id=scroll type=checkbox></DIV></DIV><H4 class=moduleHeader><SPAN class=title>全局选项</SPAN></H4><DIV class=module_body id=msgBody><DIV>&nbsp;&nbsp;左侧栏目宽度：<INPUT class=SmallInput id=col_width size=5 value=65>%</DIV></DIV><DIV class=moduleFooter id=msgCommand><INPUT id=module_id type=hidden><INPUT class=BigButton onclick=SetNums() type=button value=确定>&nbsp;&nbsp;<INPUT class=BigButtontype=button value=取消> </DIV><DIV class=moduleFooter id=msgSuccess style="DISPLAY: none"><H2>保存成功！</H2><INPUT class=BigButtontype=button value=关闭> </DIV></DIV> </body></html>
2.test.js
//装载col下的元素var colArray = []//移动时间的IDvar moveEndInterval = 0;//表示创建层是否已经存在var am=null;//标识头部是否已经初始化var isInitedHead=false;//保存便签失败后进行重新保存的时间var timeout = 3000;//记录设置层的具体HTML，以便设置完成后还原var msgBlockHTML = "";//工具方法，使用ID获取变量var $ = function(id) {return document.getElementById(id);};/** * 标题栏动作设置 */var titleAction ={"obj":null,"init":function(title_i){title_i.onmousedown=titleAction.start;if ( isNaN(parseInt(createDiv().style.left)) ) {createDiv().style.left="0px";}if ( isNaN(parseInt(createDiv().style.top)) ) {createDiv().style.top="0px";}title_i.onDragStart = new Function();title_i.onDragEnd = new Function();title_i.onDrag = new Function();},"start":function(currEvent){//当前动作对象var currTitle = titleAction.obj = this;currEvent = titleAction.fixE(currEvent);var divLeft = parseInt(createDiv().style.left);var divTop = parseInt(createDiv().style.top);//执行自定义事件currTitle.onDragStart(divLeft,divTop,currEvent.clientX,currEvent.clientY);//保留当前鼠标的位置currTitle.lastMouseX = currEvent.clientX;currTitle.lastMouseY = currEvent.clientY;//添加事件document.onmousemove = titleAction.drag;document.onmouseup = titleAction.end;},"drag":function(currEvent){currEvent=titleAction.fixE(currEvent);//当前动作对象var currTitle=titleAction.obj;//获取鼠标当前的位置var mouseX = currEvent.clientX;var mouseY = currEvent.clientY;//获取创建层的位置,并移动到新的位置var divLeft = parseInt(createDiv().style.left);var divTop = parseInt(createDiv().style.top);var createDivX = mouseX-currTitle.lastMouseX+divLeft;var createDivY = mouseY-currTitle.lastMouseY+divTop;createDiv().style.left = createDivX+"px";createDiv().style.top = createDivY+"px";//保留当前鼠标的位置currTitle.lastMouseX = mouseX;currTitle.lastMouseY = mouseY;//执行自定义事件，移动原来DIV的顺序currTitle.onDrag(createDivX,createDivY,currEvent.clientX,currEvent.clientY);return false},"end":function(){document.onmousemove=null;document.onmouseup=null;titleAction.obj.onDragEnd(parseInt(createDiv().style.left),parseInt(createDiv().style.top));titleAction.obj=null;},"fixE":function(actionevent){if (typeof actionevent=="undefined") {actionevent=window.event;}if (typeof actionevent.layerX=="undefined") {actionevent.layerX=actionevent.offsetX;}if (typeof actionevent.layerY=="undefined") {actionevent.layerY=actionevent.offsetY;}return actionevent}};/** * 初始化Head */function _upc(cols){initHead([$("col_l"),$("col_r")]);}/** * 获取HttpRequest */function getXMLHttpObj(){var a=null;if(window.ActiveXObject){a=new ActiveXObject("Msxml2.XMLHTTP");if(!a){a=new ActiveXObject("Microsoft.XMLHTTP");}}else if(window.XMLHttpRequest){a=new XMLHttpRequest();}return a;}/** * 创建一个层，如果已经存在就直接返回 */function createDiv(){if(!am){am=document.createElement("DIV");am.style.display="block";am.style.position="absolute";am.style.cursor="move";am.style.backgroundColor="#ffffff";am.style.paddingBottom="0px";document.body.appendChild(am)}return am}/** * 初始化Head */function initHead(td){if(isInitedHead)return;isInitedHead=true;colArray=td;for(var i=0;i<colArray.length;i++){var divModule = colArray.childNodes;for(var j=0;j<divModule.length;j++){var module_i = divModulevar head_i = $(module_i.id+"_head");if(!head_i){continue;}head_i.module = module_i;head_i.onmouseover = function(){var op_i=$(this.module.id+"_op");if(op_i)op_i.style.display="inline";}head_i.onmouseout = function(){var op_i=$(this.module.id+"_op");if(op_i)op_i.style.display="none";}//设置title宽度fixTitleWidth(module_i.id);var title_i = $(module_i.id+"_title");title_i.module = module_i;//初始化标题栏titleAction.init(title_i);//定义开始移动的事件（自定义，在titleAction/start中被执行）title_i.onDragStart=function(divLeft,divTop) {clearInterval(moveEndInterval);//获取模块var module_i=this.module;//设置当与模块平级的相关模块（含本模块）的pagePosLeft与pagePosTopsetCurrAfterOffset(module_i);module_i.origNextSibling=module_i.nextSibling;var module_i_copy=createDiv();module_i_copy.style.left=getOffset(module_i,"Left");module_i_copy.style.top=getOffset(module_i,"Top");module_i_copy.style.height=module_i.offsetHeight;module_i_copy.style.width=module_i.offsetWidth;module_i_copy.style.display="block";module_i_copy.style.opacity=0.8;module_i_copy.style.filter="alpha(opacity=80)";module_i_copy.innerHTML=module_i.innerHTML;module_i_copy.className=module_i.className;this.dragged=false};title_i.onDrag = function(divLeft,divTop){setModulePos(this.module,divLeft,divTop);this.dragged=true;};title_i.onDragEnd = function(divLeft,divTop){//移动过if(this.dragged){//设置循环调用，将复制的模块移动到指定的位置moveEndInterval=moveEndSetInterval(this.module,150,15);}else{createDivStyle();}//这里做AJAX操作提交改变到数据库}}}//根据cookie去初始化模块的伸缩resizeByCookie();//初始化模块的相关设置initModuleByCookie();}/** * 初始化模块的相关属性 */function initModuleByCookie(){var my_width_1 = getCookie("my_width_1");var isSetTitleWidth = false;if(my_width_1&&my_width_1!=65){$("col_l").width = my_width_1+"%";$("col_r").width = (100-my_width_1)+"%";//重新设置TITLE宽度isSetTitleWidth = true;}for(var i=0;i<colArray.length;i++){for(var j=0;j<colArray.childNodes.length;j++){var module_i=colArray.childNodes;var module_number = module_i.id.substr(7,module_i.id.length)var module_ul = $("module_"+module_number+"_ul");if(!module_ul){continue;}var my_nums_1 = getCookie("my_nums_1_"+module_number);var my_scroll_1 = getCookie("my_scroll_1_"+module_number);if(my_nums_1&&my_nums_1!=5){$("module_"+module_number+"_ul").style.height = 20*my_nums_1+"px";}if(my_scroll_1){if(module_ul.getElementsByTagName("ul").length>0){if(module_ul.getElementsByTagName("marquee").length>0){$("module_"+module_number+"_ul").childNodes.innerHTML = "<marquee height='100%' direction='up' behavior=scroll scrollamount=2 scrolldelay=100 onmouseover='this.stop()' onmouseout='this.start()' border=0>"+module_ul.innerHTML+"</marquee>";}}}//重新设置宽度if(isSetTitleWidth){fixTitleWidth(module_i.id);}}}}/** * 将createDiv移动到指定层的位置 * allTime:移动消耗总的时间 * allCount:移动消耗总的循环次数 */function moveEndSetInterval(module_i,allTime,allCount){var divLeft =parseInt(createDiv().style.left);var divTop = parseInt(createDiv().style.top);var oneMoveLeft = (divLeft-this.getOffset(module_i,"Left"))/allCount;var oneMoveTop = (divTop-this.getOffset(module_i,"Top"))/allCount;return setInterval(function(){if(allCount<1){clearInterval(moveEndInterval);createDivStyle();//设置宽度fixTitleWidth(module_i.id);return;}allCount--;divLeft-=oneMoveLeft;divTop-=oneMoveTop;createDiv().style.left = divLeft;createDiv().style.top = divTop;},allTime/allCount);}function createDivStyle(){createDiv().style.display="none";}/** * 获取最近的模块并改变原先DIV的顺序 */function setModulePos(obj,posLeft,posTop){var module=null;var referDistance=100000000;//获取离复制层最近的模块for(var i=0;i<colArray.length;i++){for(var j=0;j<colArray.childNodes.length;j++){var module_i=colArray.childNodes;//过滤自己if(module_i==obj){continue;}var currentDistance=Math.sqrt(Math.pow(posLeft-module_i.pagePosLeft,2)+Math.pow(posTop-module_i.pagePosTop,2));if(isNaN(currentDistance))continue;if(currentDistance<referDistance){referDistance=currentDistance;module=module_i;}}}//得到的最近的模块不为NULL&&不是obj相邻的模块if(module!=null&&obj.nextSibling!=module){module.parentNode.insertBefore(obj,module);}}/** * 获取在body范围内的Offset */function getOffset(obj,leftOrTop){var offsetValue=0;while(obj!=null){offsetValue+=obj["offset"+(leftOrTop=="Left"?"Left":"Top")];obj=obj.offsetParent}return offsetValue}/** * 设置当与模块平级的相关模块（含本模块）的pagePosLeft与pagePosTop */function setCurrAfterOffset(currModule_i){for(var i=0;i<colArray.length;i++){var divModule = colArray.childNodes;var oneHeigth = 0;for(var j=0;j<divModule.length;j++){var module_i = divModuleif(!module_i.id&&module_i.name!="fill"){continue;}if(module_i==currModule_i){oneHeigth = module_i.offsetHeight;}module_i.pagePosLeft = this.getOffset(module_i,"Left");module_i.pagePosTop = this.getOffset(module_i,"Top")-oneHeigth;}}}/** * 设置title的宽度 */function fixTitleWidth(module_id){if(!$(module_id)) return;var titleWidth = 0;while($(module_id+"_head").scrollWidth - $(module_id+"_text").scrollWidth - 120 - 40 - titleWidth<0||$(module_id+"_head").scrollWidth - $(module_id+"_text").scrollWidth - 120 - 40 - titleWidth>10){titleWidth = $(module_id+"_head").scrollWidth - $(module_id+"_text").scrollWidth - 120 - 40;$(module_id+"_title").style.width = titleWidth+"px";}}/*******************************************关于模块上的工具按钮**********************************//** * 获取cookie */function getCookie(name){ var arr = document.cookie.split("; "); for(i=0;i<arr.length;i++) { if (arr.split("=") == name) {return unescape(arr.split("=")); } } return null;}/** * 设置cookie */function setCookie(name,value) {var today = new Date();var expires = new Date();expires.setTime(today.getTime() + 1000*60*60*24*2000);document.cookie = name + "=" + escape(value) + "; expires=" + expires.toGMTString();}/** * 伸缩模块，并记录到cookie */function _resize(module_id,isExpand){var module_i=$("module_"+module_id);var head_i=$("module_"+module_id+"_head");var body_i=$("module_"+module_id+"_body");var img_i=$("img_resize_"+module_id);var my_cookie=getCookie("my_expand_1");my_cookie = (my_cookie==null || my_cookie=="undefined") ? "" : my_cookie;//alert(my_cookie)if(isExpand==null){if(body_i.style.display=="none"){module_i.className=module_i.className.substr(0,module_i.className.lastIndexOf(" ")); head_i.className=head_i.className.substr(0,head_i.className.lastIndexOf(" ")); body_i.style.display="block"; img_i.src=img_i.src.substr(0,img_i.src.lastIndexOf("/")+1)+"expand_arrow.png"; img_i.title="折叠"; if(my_cookie.indexOf(module_id+",") == 0) my_cookie = my_cookie.replace(module_id+",", ""); else if(my_cookie.indexOf(","+module_id+",") > 0) my_cookie = my_cookie.replace(","+module_id+",", ","); }else if(body_i.style.display!="none"){ module_i.className=module_i.className+" listColorCollapsed"; head_i.className=head_i.className+" moduleHeaderCollapsed"; body_i.style.display="none"; img_i.src=img_i.src.substr(0,img_i.src.lastIndexOf("/")+1)+"collapse_arrow.png"; img_i.title="展开"; if(my_cookie.indexOf(module_id+",") != 0 && my_cookie.indexOf(","+module_id+",") <= 0) my_cookie += module_id+",";}}else if(isExpand==true){if(body_i.style.display=="none"){module_i.className=module_i.className.substr(0,module_i.className.lastIndexOf(" ")); head_i.className=head_i.className.substr(0,head_i.className.lastIndexOf(" ")); body_i.style.display="block"; img_i.src=img_i.src.substr(0,img_i.src.lastIndexOf("/")+1)+"expand_arrow.png"; img_i.title="折叠"; if(my_cookie.indexOf(module_id+",") == 0) my_cookie = my_cookie.replace(module_id+",", ""); else if(my_cookie.indexOf(","+module_id+",") > 0) my_cookie = my_cookie.replace(","+module_id+",", ",");}}else if(isExpand==false){if(body_i.style.display!="none"){ module_i.className=module_i.className+" listColorCollapsed"; head_i.className=head_i.className+" moduleHeaderCollapsed"; body_i.style.display="none"; img_i.src=img_i.src.substr(0,img_i.src.lastIndexOf("/")+1)+"collapse_arrow.png"; img_i.title="展开"; if(my_cookie.indexOf(module_id+",") != 0 && my_cookie.indexOf(","+module_id+",") <= 0) my_cookie += module_id+",";}} setCookie("my_expand_1", my_cookie);}/** * 伸缩所有的模块,并记录到cookie */function resize_all(){var ima_all_resize = $("img_all_resize");var imgs=document.getElementsByTagName("IMG"); var imgsrc = img_all_resize.src;var lastIndex = img_all_resize.src.lastIndexOf("/");var isExpand = false;if(imgsrc.substr(lastIndex+1,imgsrc.length)=="collapse_arrow.png"){img_all_resize.src=imgsrc.substr(0,lastIndex+1)+"expand_arrow.png";isExpand = true;setCookie("my_expand_all_1", "1");}else{img_all_resize.src=imgsrc.substr(0,lastIndex+1)+"collapse_arrow.png";isExpand = false;setCookie("my_expand_all_1", "0");}//调整所有模块for(var i=0;i<imgs.length;i++){if(imgs.id.substr(0,11)!="img_resize_")continue;var module_id=imgs.id.substr(11,imgs.id.length);_resize(module_id,isExpand); }}/** * 根据cookie记录来初始化伸缩 */function resizeByCookie(){//设置resize_allvar mycookie_all = getCookie("my_expand_all_1");if(mycookie_all!=null&&mycookie_all!=""){var ima_all_resize = $("img_all_resize");var imageName = mycookie_all=="1"?"expand_arrow.png":"collapse_arrow.png";var imgsrc = img_all_resize.src;var lastIndex = img_all_resize.src.lastIndexOf("/");img_all_resize.src=imgsrc.substr(0,lastIndex+1)+imageName;}//设置resizevar mycookie = getCookie("my_expand_1");if(mycookie!=null&&mycookie!=""){var expands_id = mycookie.split(",");for(var i=0;i<expands_id.length-1;i++){var module_id = expands_id;var module_i=$("module_"+module_id); var head_i=$("module_"+module_id+"_head"); var body_i=$("module_"+module_id+"_body"); var img_i=$("img_resize_"+module_id); module_i.className=module_i.className+" listColorCollapsed"; head_i.className=head_i.className+" moduleHeaderCollapsed"; body_i.style.display="none"; img_i.src=img_i.src.substr(0,img_i.src.lastIndexOf("/")+1)+"collapse_arrow.png"; img_i.title="展开";}}}/** * 翻页 */function nextPage(module_id,page){var module_Ul=$('module_'+module_id+'_ul');if(!module_Ul) return;if(module_Ul.currPageIndex==null||module_Ul.currPageIndex=="undefined"){module_Ul.currPageIndex = 1;}//进行ajax请求数据_sendXMLGetRequest("http://192.168.1.108:8081/JLEAP/mainframe/test.jsp",module_id,"nextPage");}/** * 请求数据,请求方式为Get * type:请求的自定义类型 */function _sendXMLGetRequest(URL,paramtes,type){var xmlHttpObj=getXMLHttpObj();xmlHttpObj.open("GET",URL,true);xmlHttpObj.onreadystatechange=function(){if(xmlHttpObj.readyState==4){//请求下页数据if(type == "nextPage"){showNextPage(paramtes,xmlHttpObj.responseText);}else if(type = "_del"){showDelMoudle();}}}xmlHttpObj.send(null);}/** * 请求数据,请求方式为POST * type:请求的自定义类型 */function _sendXMLPostRequest(URL,paramtes,type){var xmlHttpObj = getXMLHttpObj();xmlHttpObj.open("POST", URL,true);xmlHttpObj.setRequestHeader("Method", "POST notes.php HTTP/1.1");xmlHttpObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");xmlHttpObj.onreadystatechange = function() {if (xmlHttpObj.readyState == 4){//保存便签if(type=="saveNotes"){showSaveNotes(xmlHttpObj);}}};xmlHttpObj.send(paramtes);}/** * 保存便签内容 */function saveNotes(){ alert("999999990"); var paramtes = "CONTENT="+encodeURIComponent($("note_1").value); _sendXMLPostRequest("http://192.168.1.108:8081/JLEAP/mainframe/test.jsp",paramtes,"saveNotes");}/** * 保存便签后的操作 */function showSaveNotes(xmlHttpObj){var s;try {s = xmlHttpObj.status;}catch (ex) { alert(ex.description);}if (s == 200){ if(xmlHttpObj.responseText.substr(0,3)!="+OK"){ alert("保存便签内容错误，错误信息：\n"+xmlHttpObj.responseText); window.setTimeout("saveNotes()", timeout); timeout = timeout*2; } else{ timeout=3000; }}else{ alert("保存便签内容错误，错误代码："+s); window.setTimeout("save_notes()", timeout); timeout = timeout*2;}}/** * 显示相关下页数据 */function showNextPage(module_id,responseText){}/** * 删除模块后的动作 */function showDelMoudle(){}/** * 删除模块 */function _del(a){msg="确认不显示该模块么?";if(window.confirm(msg)){var module=$("module_"+a);if(module)module.style.display="none";_sendXMLGetRequest("http://192.168.1.108:8081/JLEAP/mainframe/test.jsp",null,"_del")}}/** * 模块设置 */function _edit(module_id){ show_msg("optionBlock"); $("optionBlockTitle").innerText=$("module_"+module_id+"_text").innerText+" 模块选项"; $('display_lines').focus(); $('display_lines').value=lines_per_page(module_id); $('scroll').checked=getCookie("my_scroll_1_"+module_id)=="true"; var my_width_1 = parseInt(getCookie("my_width_1")) $('col_width').value=my_width_1?my_width_1:65; $('module_id').value=module_id;}/** * 显示覆盖层和设置层 */function show_msg(msgBlock){ msgBlockHTML = $(msgBlock).innerHTML; $("overlay").style.display = 'block'; $(msgBlock).style.display = 'block'; var bb=(document.compatMode && document.compatMode!="BackCompat") ? document.documentElement : document.body; if(document.compatMode && document.compatMode!="BackCompat") { $("overlay").style.width = bb.scrollWidth+"px"; $("overlay").style.height = bb.scrollHeight+"px"; } else { $("overlay").style.width = bb.scrollWidth+"px"; $("overlay").style.height = bb.scrollHeight+"px"; } $(msgBlock).style.left = ((bb.offsetWidth - $(msgBlock).offsetWidth)/2)+"px"; $(msgBlock).style.top= (60 + bb.scrollTop)+"px";}/** * 隐藏覆盖层和设置层，并做还原处理 */function hide_msg(msgBlock){ $(msgBlock).innerHTML = msgBlockHTML; $("overlay").style.display = 'none'; $(msgBlock).style.display = 'none';}/** * 设置模块，提交数据并保存到COOKIE */function SetNums(){var today_lines=$('display_lines').value;var col_width=$('col_width').value; if(today_lines=="" || checkNum(today_lines) || col_width=="" || checkNum(col_width)) { alert("显示条数和栏目宽度必须是数字"); return; } if(parseInt(today_lines)<=0 || parseInt(today_lines)>=1000) { alert("显示条数必须在1-1000之间"); return; } if(parseInt(col_width)<=0 || parseInt(col_width)>100) { alert("栏目宽度必须在1-100之间"); return; } setCookie("my_nums_1_"+$('module_id').value, today_lines); setCookie("my_scroll_1_"+$('module_id').value, $('scroll').checked); setCookie("my_width_1", col_width); //my_width=col_width; $("msgBody").style.display = "none"; $("msgCommand").style.display = "none"; $("msgSuccess").style.display = "block"; window.location.reload();}/** * 获取当前容纳的行数 */function lines_per_page(module_id){ return Math.floor(parseInt($("module_"+module_id+"_ul").style.height)/20);}/** * 检查是否为数字类型 */function checkNum(str){ var re=/\D/; return str.match(re);}
3,mytable.css
HTML {OVERFLOW-Y: scroll}BODY {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #e2e5e6; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px}A:link {COLOR: #0066cc; TEXT-DECORATION: none}A:visited {COLOR: #0066cc; TEXT-DECORATION: none}A:hover {COLOR: #333333; TEXT-DECORATION: underline}A:active {COLOR: #333333; TEXT-DECORATION: underline}UL {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 0px 3px; LINE-HEIGHT: 20px; PADDING-TOP: 0px}LI {PADDING-RIGHT: 0px; PADDING-LEFT: 16px; BACKGROUND: url(black_dot.png) no-repeat left 50%; PADDING-BOTTOM: 0px; MARGIN: 0px; LINE-HEIGHT: 20px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none}UNKNOWN {COLOR: #0066cc; TEXT-DECORATION: none}LI A:visited {COLOR: #333333; TEXT-DECORATION: none}LI A:hover {COLOR: #333333; TEXT-DECORATION: underline}LI A:active {COLOR: #333333; TEXT-DECORATION: underline}UNKNOWN {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; VERTICAL-ALIGN: middle; BORDER-RIGHT-WIDTH: 0px}#desktop_config {PADDING-TOP: 5px}#desktop_config IMG {CURSOR: pointer}#overlay {DISPLAY: none; Z-INDEX: 10000; BACKGROUND: #000; FILTER: alpha(opacity=50); LEFT: 0px; POSITION: absolute; TOP: 0px; HEIGHT: 100%; opacity: 0.5; moz-opacity: 0.5}.dialogBlock {CLEAR: both; Z-INDEX: 10002; MARGIN: 10px auto; POSITION: absolute; TOP: 100px}.dialogBlock .menu {FLOAT: left; WIDTH: 120px}.dialogBlock .menu A {BORDER-RIGHT: white 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: white 1px solid; DISPLAY: block; PADDING-LEFT: 10px; BACKGROUND: none transparent scroll repeat 0% 0%; MARGIN-BOTTOM: 5px; PADDING-BOTTOM: 3px; BORDER-LEFT: white 1px solid; COLOR: #645a44; PADDING-TOP: 3px; BORDER-BOTTOM: white 1px solid; TEXT-ALIGN: center; TEXT-DECORATION: none}.dialogBlock .menu A:hover {BORDER-LEFT-COLOR: #99cc00; BACKGROUND: url(bg_input_btn_hover.png) #f4fadf; BORDER-BOTTOM-COLOR: #80aa00; COLOR: #395500; BORDER-TOP-COLOR: #99cc00; TEXT-DECORATION: none! important; BORDER-RIGHT-COLOR: #80aa00}.dialogBlock .menu .current {BORDER-LEFT-COLOR: #c8c4bb; BACKGROUND: url(bg_input_btn.png) #f4fbe1; BORDER-BOTTOM-COLOR: #aba498; BORDER-TOP-COLOR: #c8c4bb; BORDER-RIGHT-COLOR: #aba498}.dialogBlock .subContent {BORDER-RIGHT: #b8d1e2 1px solid; BORDER-TOP: #b8d1e2 1px solid; BACKGROUND: url(bg_input_text.png) white repeat-x left top; FLOAT: right; BORDER-LEFT: #b8d1e2 1px solid; WIDTH: 500px; COLOR: #663300; BORDER-BOTTOM: #b8d1e2 1px solid}.module {BORDER-RIGHT: #dedcd8 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #dedcd8 1px solid; PADDING-LEFT: 0px; BACKGROUND: white; MARGIN-BOTTOM: 10px; PADDING-BOTTOM: 0px; MARGIN-LEFT: 10px; BORDER-LEFT: #dedcd8 1px solid; PADDING-TOP: 0px; BORDER-BOTTOM: #dedcd8 1px solid}.moduleHeader {PADDING-RIGHT: 1%; PADDING-LEFT: 1%; WIDTH:98%; FONT-WEIGHT: normal; FONT-SIZE: 12px; BACKGROUND: url(module_hd_bg.png) #f4f3f0 repeat-x left top; PADDING-BOTTOM: 3px; MARGIN: 0px; OVERFLOW: hidden; LINE-HEIGHT: 14px; PADDING-TOP: 3px; BORDER-BOTTOM: #dedcd8 1px dotted}.moduleHeader .icon {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 0px; PADDING-TOP: 5px}.moduleHeader .text {PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FLOAT: left; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; CURSOR: pointer; LINE-HEIGHT: 25px; PADDING-TOP: 2px}.moduleHeader .title {PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FLOAT: left; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; LINE-HEIGHT: 25px; PADDING-TOP: 2px}.moduleHeader .option {PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FLOAT: right; PADDING-BOTTOM: 2px; CURSOR: pointer; PADDING-TOP: 2px; TEXT-DECORATION: none}.moduleHeader .close {DISPLAY: none; 3px; PADDING-LEFT: 3px; FLOAT: right; PADDING-BOTTOM: 2px; CURSOR: pointer; PADDING-TOP: 2px; TEXT-ALIGN: right; TEXT-DECORATION: none}.module_body {PADDING-RIGHT: 1%! important; PADDING-LEFT: 1%! important; WIDTH:98%; FONT-SIZE: 9pt; PADDING-BOTTOM: 10px! important; MARGIN: 0px; OVERFLOW: hidden! important; important; PADDING-TOP: 10px! important}.moduleFooter {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 12px; MARGIN-BOTTOM: 10px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; TEXT-ALIGN: center}.module_page {DISPLAY: none}.module_div {OVERFLOW: hidden}.PageLinkDisable {COLOR: #cccccc! important}.listColor {BORDER-RIGHT: #9f9f9f 1px solid; BORDER-TOP: #9f9f9f 1px solid; BORDER-LEFT: #9f9f9f 1px solid; COLOR: #000000; BORDER-BOTTOM: #9f9f9f 1px solid}.listColor HR {BORDER-BOTTOM: #dcdcdc 1px solid}.listColor .moduleHeader {BACKGROUND: url(images/list_hd_bg.png) #f4f3f0 repeat-x; BORDER-BOTTOM: #dedcd8 1px solid}.listColor .moduleHeaderCollapsed {BORDER-BOTTOM-WIDTH: 0px}.listColor .module_body {BACKGROUND: #eeebe8}.listColor .bright {COLOR: #003366! important}BODY {FONT-SIZE: 9pt}FORM {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px}A:link {COLOR: #0066cc; TEXT-DECORATION: none}A:visited {COLOR: #0066cc; TEXT-DECORATION: none}A:hover {COLOR: #333333; TEXT-DECORATION: underline}A:active {COLOR: #333333; TEXT-DECORATION: underline}A.A1:link {COLOR: #124164; TEXT-DECORATION: underline}A.A1:visited {COLOR: #124164; TEXT-DECORATION: underline}A.A1:active {COLOR: #124164; TEXT-DECORATION: underline}A.A1:hover {COLOR: #ff0000; TEXT-DECORATION: underline}A.orgAdd:link {PADDING-LEFT: 12px; BACKGROUND: url(org_select.png) no-repeat 0px 0px; COLOR: #207bd6}A.orgAdd:visited {PADDING-LEFT: 12px; BACKGROUND: url(org_select.png) no-repeat 0px 0px; COLOR: #207bd6}A.orgAdd:hover {COLOR: #207bd6; TEXT-DECORATION: underline}A.orgAdd:active {COLOR: #207bd6; TEXT-DECORATION: underline}A.orgClear:link {PADDING-LEFT: 12px; BACKGROUND: url(org_select.png) no-repeat 0px -60px; MARGIN-LEFT: 5px; COLOR: #9aa9b8}A.orgClear:visited {PADDING-LEFT: 12px; BACKGROUND: url(org_select.png) no-repeat 0px -60px; MARGIN-LEFT: 5px; COLOR: #9aa9b8}A.orgClear:hover {BACKGROUND-POSITION: 0px -40px; COLOR: #207bd6; TEXT-DECORATION: underline}A.orgClear:active {BACKGROUND-POSITION: 0px -40px; COLOR: #207bd6; TEXT-DECORATION: underline}A.addfile {DISPLAY: block; PADDING-LEFT: 12px; BACKGROUND: url(org_select.png) no-repeat 0px 3px; FLOAT: left; COLOR: #207bd6; POSITION: relative; TEXT-DECORATION: none}A.addfile:hover {BACKGROUND-POSITION: 0px -17px; COLOR: #9aa9b8; TEXT-DECORATION: underline}INPUT.addfile {FILTER: alpha(opacity=0); LEFT: -5px; WIDTH: 1px; CURSOR: pointer; POSITION: absolute; opacity: 0}A.selfile:link {COLOR: #207bd6; TEXT-DECORATION: none}A.selfile:visited {COLOR: #207bd6; TEXT-DECORATION: none}A.selfile:hover {COLOR: #9aa9b8; TEXT-DECORATION: underline}A.selfile:active {COLOR: #9aa9b8; TEXT-DECORATION: underline}IMG {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px}TABLE {BORDER-COLLAPSE: collapse}.bodycolor {BACKGROUND: #e2e5e6}.loginbodycolor {BACKGROUND: #6ba2d8}.topbar {FONT-SIZE: 9pt; BACKGROUND: url(topbar.gif) #c4d9ef}.topbar2 {FONT-SIZE: 9pt; BACKGROUND: url(menubg.gif) #c4d9ef}.panel {BACKGROUND: #c4d9ef; COLOR: #654125}.timebar {BACKGROUND: #cedff1}.menu_tr1 {FONT-SIZE: 9pt; BACKGROUND-IMAGE: url(topbar.gif); CURSOR: pointer; COLOR: #000000}.menu_tr2 {FONT-SIZE: 9pt; BACKGROUND: #cedff1; CURSOR: pointer; COLOR: #000000}.small {FONT-SIZE: 9pt}.small1 {FONT-SIZE: 9pt; COLOR: #000000}.big {FONT-SIZE: 12pt}.big1 {FONT-SIZE: 12pt; COLOR: #000000}.big2 {FONT-SIZE: 18pt}.big3 {FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: #124164}.big4 {COLOR: #ff0000}.verybig {FONT-SIZE: 24pt}.ArrowButtonL {BACKGROUND: url(/images/previouspage.gif) no-repeat center center; WIDTH: 20px; HEIGHT: 16px}.ArrowButtonR {BACKGROUND: url(/images/nextpage.gif) no-repeat center center; WIDTH: 20px; HEIGHT: 16px}.ArrowButtonLL {BACKGROUND: url(/images/prevpreviouspage.png) no-repeat center center; WIDTH: 20px; HEIGHT: 16px}.ArrowButtonRR {BACKGROUND: url(/images/nextnextpage.png) no-repeat center center; WIDTH: 20px; HEIGHT: 16px}INPUT.SmallButton {BORDER-RIGHT: #6e91c7 1px solid; BORDER-TOP: #6e91c7 1px solid; FONT-SIZE: 9pt; BACKGROUND: url(button_bg.gif) #f4fbe1; BORDER-LEFT: #6e91c7 1px solid; BORDER-BOTTOM: #6e91c7 1px solid; HEIGHT: 20px; TEXT-DECORATION: none}INPUT.ArrowButton {BORDER-RIGHT: #6e91c7 1px solid; BORDER-TOP: #6e91c7 1px solid; FONT-SIZE: 9pt; BACKGROUND: url(button_bg.gif) #f4fbe1; BORDER-LEFT: #6e91c7 1px solid; BORDER-BOTTOM: #6e91c7 1px solid; HEIGHT: 20px; TEXT-DECORATION: none}INPUT.SmallButton:hover {BORDER-RIGHT: #80aa00 1px solid; BORDER-TOP: #99cc00 1px solid; FONT-SIZE: 9pt; BACKGROUND: url(bg_input_btn_hover.png) #f4fadf; BORDER-LEFT: #99cc00 1px solid; COLOR: #395500; BORDER-BOTTOM: #80aa00 1px solid}INPUT.ArrowButton:hover {BORDER-RIGHT: #80aa00 1px solid; BORDER-TOP: #99cc00 1px solid; FONT-SIZE: 9pt; BACKGROUND: url(bg_input_btn_hover.png) #f4fadf; BORDER-LEFT: #99cc00 1px solid; COLOR: #395500; BORDER-BOTTOM: #80aa00 1px solid}INPUT.BigButton {BORDER-RIGHT: #6e91c7 1px solid; BORDER-TOP: #6e91c7 1px solid; FONT-SIZE: 12pt; BACKGROUND: url(button_bg.gif) #f4fbe1; MARGIN: 1px; BORDER-LEFT: #6e91c7 1px solid; BORDER-BOTTOM: #6e91c7 1px solid; HEIGHT: 24px; TEXT-DECORATION: none}INPUT.BigButton:hover {BORDER-RIGHT: #80aa00 1px solid; BORDER-TOP: #99cc00 1px solid; FONT-SIZE: 12pt; BACKGROUND: url(bg_input_btn_hover.png) #f4fadf; BORDER-LEFT: #99cc00 1px solid; COLOR: #395500; BORDER-BOTTOM: #80aa00 1px solid}INPUT.SmallButtonAHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_a.png) no-repeat 0px -21px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 50px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonA {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_a.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 50px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonA:hover {BACKGROUND-POSITION: 0px -21px}INPUT.SmallButtonBHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_b.png) no-repeat 0px -21px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 74px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonB {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_b.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 74px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonB:hover {BACKGROUND-POSITION: 0px -21px}INPUT.SmallButtonCHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_c.png) no-repeat 0px -21px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 105px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonC {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_c.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 105px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonC:hover {BACKGROUND-POSITION: 0px -21px}INPUT.SmallButtonDHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_d.png) no-repeat 0px -21px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 160px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonD {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_d.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 160px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonD:hover {BACKGROUND-POSITION: 0px -21px}INPUT.SmallButtonEHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_e.png) no-repeat 0px -21px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 245px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonE {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(btn_e.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 245px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 21px; BORDER-RIGHT-WIDTH: 0px}INPUT.SmallButtonE:hover {BACKGROUND-POSITION: 0px -21px}INPUT.BigButtonAHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_a.png) no-repeat 0px -24px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 60px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonA {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_a.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 60px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonA:hover {BACKGROUND-POSITION: 0px -24px}INPUT.BigButtonBHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_b.png) no-repeat 0px -24px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 84px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonB {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_b.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 84px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonB:hover {BACKGROUND-POSITION: 0px -24px}INPUT.BigButtonCHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_c.png) no-repeat 0px -24px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 125px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonC {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_c.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 125px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonC:hover {BACKGROUND-POSITION: 0px -24px}INPUT.BigButtonDHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_d.png) no-repeat 0px -24px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 195px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonD {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_d.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 195px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonD:hover {BACKGROUND-POSITION: 0px -24px}INPUT.BigButtonEHover {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_e.png) no-repeat 0px -24px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 305px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonE {BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12pt; BACKGROUND: url(big_btn_e.png) no-repeat; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 305px; CURSOR: pointer; COLOR: #ffffff; HEIGHT: 24px; BORDER-RIGHT-WIDTH: 0px}INPUT.BigButtonE:hover {BACKGROUND-POSITION: 0px -24px}INPUT.BigInput {BORDER-RIGHT: #c0bbb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #c0bbb4 1px solid; PADDING-LEFT: 5px; FONT-SIZE: 10pt; BACKGROUND: url(bg_input_text.png) white repeat-x left top; PADDING-BOTTOM: 1px; BORDER-LEFT: #c0bbb4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #c0bbb4 1px solid}TEXTAREA.BigInput {BORDER-RIGHT: #c0bbb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #c0bbb4 1px solid; PADDING-LEFT: 5px; FONT-SIZE: 10pt; BACKGROUND: url(bg_input_text.png) white repeat-x left top; PADDING-BOTTOM: 1px; BORDER-LEFT: #c0bbb4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #c0bbb4 1px solid}INPUT.BigInput:hover {BORDER-RIGHT: #99cc00 1px solid; BORDER-TOP: #99cc00 1px solid; FONT-SIZE: 10pt; BACKGROUND: url(bg_input_text_hover.png) white repeat-x left top; BORDER-LEFT: #99cc00 1px solid; BORDER-BOTTOM: #99cc00 1px solid}TEXTAREA.BigInput:hover {BORDER-RIGHT: #99cc00 1px solid; BORDER-TOP: #99cc00 1px solid; FONT-SIZE: 10pt; BACKGROUND: url(bg_input_text_hover.png) white repeat-x left top; BORDER-LEFT: #99cc00 1px solid; BORDER-BOTTOM: #99cc00 1px solid}INPUT.SmallInput {BORDER-RIGHT: #c0bbb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #c0bbb4 1px solid; PADDING-LEFT: 5px; FONT-SIZE: 9pt; BACKGROUND: url(bg_input_text.png) white repeat-x left top; PADDING-BOTTOM: 1px; BORDER-LEFT: #c0bbb4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #c0bbb4 1px solid}TEXTAREA.SmallInput {BORDER-RIGHT: #c0bbb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #c0bbb4 1px solid; PADDING-LEFT: 5px; FONT-SIZE: 9pt; BACKGROUND: url(bg_input_text.png) white repeat-x left top; PADDING-BOTTOM: 1px; BORDER-LEFT: #c0bbb4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #c0bbb4 1px solid}INPUT.SmallInput:hover {BORDER-RIGHT: #99cc00 1px solid; BORDER-TOP: #99cc00 1px solid; FONT-SIZE: 9pt; BACKGROUND: url(bg_input_text_hover.png) white repeat-x left top; BORDER-LEFT: #99cc00 1px solid; BORDER-BOTTOM: #99cc00 1px solid}TEXTAREA.SmallInput:hover {BORDER-RIGHT: #99cc00 1px solid; BORDER-TOP: #99cc00 1px solid; FONT-SIZE: 9pt; BACKGROUND: url(bg_input_text_hover.png) white repeat-x left top; BORDER-LEFT: #99cc00 1px solid; BORDER-BOTTOM: #99cc00 1px solid}INPUT.BigInputMoney {BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; FONT-WEIGHT: normal; FONT-SIZE: 12pt; BACKGROUND: #f8f8f8; BORDER-LEFT: black 1px solid; COLOR: #006; LINE-HEIGHT: normal; BORDER-BOTTOM: black 1px double; FONT-STYLE: normal; HEIGHT: 22px; TEXT-ALIGN: right; FONT-VARIANT: normal}INPUT.BigStatic {BORDER-RIGHT: #c0bbb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #c0bbb4 1px solid; PADDING-LEFT: 5px; FONT-SIZE: 10pt; BACKGROUND: #e0e0e0; PADDING-BOTTOM: 1px; BORDER-LEFT: #c0bbb4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #c0bbb4 1px solid}TEXTAREA.BigStatic {BORDER-RIGHT: #c0bbb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #c0bbb4 1px solid; PADDING-LEFT: 5px; FONT-SIZE: 10pt; BACKGROUND: #e0e0e0; PADDING-BOTTOM: 1px; BORDER-LEFT: #c0bbb4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #c0bbb4 1px solid}INPUT.SmallStatic {BORDER-RIGHT: #c0bbb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #c0bbb4 1px solid; PADDING-LEFT: 5px; FONT-SIZE: 9pt; BACKGROUND: #e0e0e0; PADDING-BOTTOM: 1px; BORDER-LEFT: #c0bbb4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #c0bbb4 1px solid}TEXTAREA.SmallStatic {BORDER-RIGHT: #c0bbb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #c0bbb4 1px solid; PADDING-LEFT: 5px; FONT-SIZE: 9pt; BACKGROUND: #e0e0e0; PADDING-BOTTOM: 1px; BORDER-LEFT: #c0bbb4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #c0bbb4 1px solid}SELECT.BigSelect {BORDER-RIGHT: #c0bbb4 1px solid; BORDER-TOP: #c0bbb4 1px solid; FONT-WEIGHT: normal; FONT-SIZE: 12pt; BACKGROUND: url(bg_input_text.png) white repeat-x left top; BORDER-LEFT: #c0bbb4 1px solid; COLOR: #000066; LINE-HEIGHT: normal; BORDER-BOTTOM: #c0bbb4 1px double; FONT-STYLE: normal; HEIGHT: 22px; FONT-VARIANT: normal}SELECT.BigSelect:hover {BORDER-RIGHT: #c0bbb4 1px solid; BORDER-TOP: #c0bbb4 1px solid; FONT-WEIGHT: normal; FONT-SIZE: 12pt; BACKGROUND: url(bg_input_text_hover.png) white repeat-x left top; BORDER-LEFT: #c0bbb4 1px solid; COLOR: #000066; LINE-HEIGHT: normal; BORDER-BOTTOM: #c0bbb4 1px double; FONT-STYLE: normal; HEIGHT: 22px; FONT-VARIANT: normal}SELECT.SmallSelect {BORDER-RIGHT: #c0bbb4 1px solid; BORDER-TOP: #c0bbb4 1px solid; FONT-WEIGHT: normal; FONT-SIZE: 9pt; BACKGROUND: url(bg_input_text.png) white repeat-x left top; BORDER-LEFT: #c0bbb4 1px solid; COLOR: #000066; LINE-HEIGHT: normal; BORDER-BOTTOM: #c0bbb4 1px double; FONT-STYLE: normal; HEIGHT: 18px; FONT-VARIANT: normal}SELECT.SmallSelect:hover {BORDER-RIGHT: #c0bbb4 1px solid; BORDER-TOP: #c0bbb4 1px solid; FONT-WEIGHT: normal; FONT-SIZE: 9pt; BACKGROUND: url(bg_input_text_hover.png) white repeat-x left top; BORDER-LEFT: #c0bbb4 1px solid; COLOR: #000066; LINE-HEIGHT: normal; BORDER-BOTTOM: #c0bbb4 1px double; FONT-STYLE: normal; HEIGHT: 18px; FONT-VARIANT: normal}SELECT.BigStatic {BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; FONT-WEIGHT: normal; FONT-SIZE: 12pt; BACKGROUND: #e0e0e0; BORDER-LEFT: black 1px solid; COLOR: #000066; LINE-HEIGHT: normal; BORDER-BOTTOM: black 1px double; FONT-STYLE: normal; HEIGHT: 22px; FONT-VARIANT: normal}SELECT.SmallStatic {BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; FONT-WEIGHT: normal; FONT-SIZE: 9pt; BACKGROUND: #e0e0e0; BORDER-LEFT: black 1px solid; COLOR: #000066; LINE-HEIGHT: normal; BORDER-BOTTOM: black 1px solid; FONT-STYLE: normal; HEIGHT: 18px; FONT-VARIANT: normal}.TableControl {BACKGROUND: url(footer_bg.png) left bottom}.TableHeader {FONT-WEIGHT: bold; FONT-SIZE: 9pt; BACKGROUND: url(images/list_hd_bg.png); COLOR: #2e2e5a; LINE-HEIGHT: 25px}.TableHeader1 {BACKGROUND: url(button_back.gif) #d3e5fa; CURSOR: pointer; COLOR: #000066}.TableHeader2 {FONT-WEIGHT: bold; BACKGROUND: url(menubg.gif) #d3e5fa; CURSOR: pointer; COLOR: #000066}.TableContent {BACKGROUND: #f0f0f0}.TableData {BACKGROUND: #ffffff; COLOR: #000000}.TableLine1 {BACKGROUND: #f3f3f3}.TableLine2 {BACKGROUND: #ffffff}.TableRed {BACKGROUND: #ffebeb}.TextColor1 {COLOR: #ff6600}.TextColor2 {COLOR: #ff0000}.top {FONT-WEIGHT: bold; COLOR: #ff0000}.percent {BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #666666 1px solid; MARGIN-TOP: 3px; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 0px; BORDER-LEFT: #666666 1px solid; PADDING-TOP: 0px; BORDER-BOTTOM: #666666 1px solid; HEIGHT: 12px}.percent DIV {FONT-SIZE: 0px; MARGIN: 1px; HEIGHT: 8px}.percenttxt {MARGIN-TOP: 1px; FONT-SIZE: 9pt; FLOAT: left}.s_on {FONT-SIZE: 9pt; BACKGROUND: url(/images/topmenubg2.gif)}.s_of {FONT-SIZE: 9pt; BACKGROUND: url(/images/topmenubg1.gif)}.m_on {FONT-SIZE: 9pt; BACKGROUND: url(/images/topmenubg2.gif)}.border14-1 {BORDER-RIGHT: #2e2e5a 1px solid; BORDER-TOP: #2e2e5a 1px solid; FONT-SIZE: 14px; BORDER-LEFT: #2e2e5a 1px solid; BORDER-BOTTOM: #2e2e5a 1px solid}.border14-2 {BORDER-RIGHT: #2e2e5a 1px solid; FONT-SIZE: 14px; BORDER-BOTTOM: #2e2e5a 1px solid}.border14-3 {FONT-SIZE: 14px; BORDER-TOP-STYLE: none; BORDER-BOTTOM: #98bbd6 1px solid; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none}.border14-4 {BORDER-RIGHT: #98bbd6 1px solid; FONT-SIZE: 14px}.title_text {FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: #0a5fa2}.table_border {BORDER-RIGHT: #98bbd6 1px solid; BORDER-TOP: #98bbd6 1px solid; BORDER-LEFT: #98bbd6 1px solid; BORDER-BOTTOM: black 0px solid}.table_bg {BORDER-RIGHT: black 1px solid; BACKGROUND-POSITION: left 50%; BORDER-TOP: #2e2e5a 1px solid; BACKGROUND-ATTACHMENT: fixed; BACKGROUND-IMAGE: url(bg_header.png); BORDER-LEFT: black 1px solid; BORDER-BOTTOM: #2e2e5a 0px solid; BACKGROUND-REPEAT: repeat}.table_left {BACKGROUND-POSITION: left 50%; BACKGROUND-ATTACHMENT: fixed; BACKGROUND-IMAGE: url(table_left.gif); BACKGROUND-REPEAT: no-repeat}.attach_name:link {COLOR: #0d3a73}.attach_name:hover {COLOR: #0d3a73}.attach_name:active {COLOR: #0d3a73}.attach_name:visited {COLOR: #0d3a73}.attach_div {BORDER-RIGHT: #124164 1px solid; BORDER-TOP: #124164 1px solid; DISPLAY: none; Z-INDEX: 10001; BACKGROUND: #ffffff; BORDER-LEFT: #124164 1px solid; WIDTH: 100px; BORDER-BOTTOM: #124164 1px solid; POSITION: absolute}.attach_div A {PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 10px; PADDING-BOTTOM: 0px; WIDTH: 100%; LINE-HEIGHT: 20px; PADDING-TOP: 3px}.attach_div A:hover {BACKGROUND: #e2e5e6; WIDTH: auto}.TableList {BORDER-RIGHT: #9f9f9f 1px solid; BORDER-TOP: #9f9f9f 1px solid; FONT-SIZE: 9pt; BORDER-LEFT: #9f9f9f 1px solid; LINE-HEIGHT: 25px; BORDER-BOTTOM: #9f9f9f 1px solid; BORDER-COLLAPSE: collapse}.TableList TD {PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; COLOR: #000000; PADDING-TOP: 3px}.TableList .TableHeader TD {BORDER-RIGHT: #dcdcdc 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #9f9f9f 1px solid; PADDING-LEFT: 0px; FONT-WEIGHT: bold; BACKGROUND: url(images/list_hd_bg.png); PADDING-BOTTOM: 0px; PADDING-TOP: 0px; TEXT-ALIGN: center}.TableList TD.TableHeader {BORDER-RIGHT: #dcdcdc 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #9f9f9f 1px solid; PADDING-LEFT: 0px; FONT-WEIGHT: bold; BACKGROUND: url(images/list_hd_bg.png); PADDING-BOTTOM: 0px; PADDING-TOP: 0px; TEXT-ALIGN: center}.TableList .TableLine1 TD {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: #f8f8f8}.TableList TD.TableLine1 {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: #f8f8f8}.TableList .TableLine2 TD {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: #ffffff}.TableList TD.TableLine2 {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: #ffffff}.TableList .TableData TD {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: #ffffff}.TableList TD.TableData {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: #ffffff}.TableList .TableContent TD {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: #f0f0f0}.TableList TD.TableContent {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: #f0f0f0}.TableList .TableFooter TD {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: url(footer_bg.png) left bottom}.TableList .TableControl TD {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: url(footer_bg.png) left bottom}.TableList TD.TableFooter {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: url(footer_bg.png) left bottom}.TableList TD.TableControl {BORDER-TOP: #dcdcdc 1px solid; BACKGROUND: url(footer_bg.png) left bottom}.TableList .TableRed TD {BACKGROUND: #ffebeb}.TableList TD.TableRed {BACKGROUND: #ffebeb}.TableList .TextColor1 TD {COLOR: #ff6600}.TableList TD.TextColor1 {COLOR: #ff6600}.TableList .TextColor2 TD {COLOR: #ff0000}.TableList TD.TextColor2 {COLOR: #ff0000}.TableBlock {BORDER-RIGHT: #124164 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #124164 1px solid; PADDING-LEFT: 3px; FONT-SIZE: 9pt; PADDING-BOTTOM: 3px; BORDER-LEFT: #124164 1px solid; LINE-HEIGHT: 20px; PADDING-TOP: 3px; BORDER-BOTTOM: #124164 1px solid; BORDER-COLLAPSE: collapse}.TableBlock TD {PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; COLOR: #000000; PADDING-TOP: 3px}.TableBlock .TableHeader TD {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #9f9f9f 1px solid; FONT-WEIGHT: bold; BACKGROUND: url(images/list_hd_bg.png); COLOR: #124164; LINE-HEIGHT: 25px}.TableBlock TD.TableHeader {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #9f9f9f 1px solid; FONT-WEIGHT: bold; BACKGROUND: url(images/list_hd_bg.png); COLOR: #124164; LINE-HEIGHT: 25px}.TableBlock .TableLine1 TD {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #606275 1px solid; BACKGROUND: #f8f8f8}.TableBlock TD.TableLine1 {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #606275 1px solid; BACKGROUND: #f8f8f8}.TableBlock .TableLine2 TD {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #606275 1px solid; BACKGROUND: #ffffff}.TableBlock TD.TableLine2 {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #606275 1px solid; BACKGROUND: #ffffff}.TableBlock .TableData TD {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #606275 1px solid; BACKGROUND: #ffffff}.TableBlock TD.TableData {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #606275 1px solid; BACKGROUND: #ffffff}.TableBlock .TableContent TD {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #606275 1px solid; BACKGROUND: #f0f0f0}.TableBlock TD.TableContent {BORDER-RIGHT: #606275 1px solid; BORDER-TOP: #606275 1px solid; BACKGROUND: #f0f0f0}.TableBlock .TableFooter TD {BORDER-TOP: #606275 1px solid; BACKGROUND: url(footer_bg.png) left bottom}.TableBlock .TableControl TD {BORDER-TOP: #606275 1px solid; BACKGROUND: url(footer_bg.png) left bottom}.TableBlock TD.TableFooter {BORDER-TOP: #606275 1px solid; BACKGROUND: url(footer_bg.png) left bottom}.TableBlock TD.TableControl {BORDER-TOP: #606275 1px solid; BACKGROUND: url(footer_bg.png) left bottom}.TableBlock .TableRed TD {BACKGROUND: #ffebeb}.TableBlock TD.TableRed {BACKGROUND: #ffebeb}.Content {LINE-HEIGHT: normal}.TableControl A {COLOR: #124164; TEXT-DECORATION: none}.TableBlock .TableRowHover TD {BACKGROUND: #e2e5e6}.TableBlock TD.TableRowHover {BACKGROUND: #e2e5e6}.TableBlock .TableRowActive TD {BACKGROUND: #7d95a5; COLOR: #ffffff}.TableBlock TD.TableRowActive {BACKGROUND: #7d95a5; COLOR: #ffffff}.MessageBox {BORDER-RIGHT: #124164 1px dotted; BORDER-TOP: #124164 1px dotted; MARGIN-TOP: 15px; BACKGROUND: #ffffff; MARGIN-BOTTOM: 15px; BORDER-LEFT: #124164 1px dotted; BORDER-BOTTOM: #124164 1px dotted}.MessageBox TD.msg {PADDING-RIGHT: 20px; PADDING-LEFT: 90px; FONT-WEIGHT: bold; PADDING-BOTTOM: 10px; PADDING-TOP: 5px; HEIGHT: 90px}.MessageBox TD.msg H4.title {FONT-SIZE: 18pt; MARGIN-BOTTOM: 10px; COLOR: #124164; BORDER-BOTTOM: #124164 1px dotted}.MessageBox TD.msg DIV.content {COLOR: #6bad42; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none}.MessageBox TD.error {BACKGROUND: url(/images/icon64_error.png) no-repeat 10px 10px}.MessageBox TD.info {BACKGROUND: url(/images/icon64_info.png) no-repeat 10px 10px}.MessageBox TD.warning {BACKGROUND: url(/images/icon64_warning.png) no-repeat 10px 10px}.MessageBox TD.forbidden {BACKGROUND: url(/images/icon64_forbidden.png) no-repeat 10px 10px}.MessageBox TD.stop {BACKGROUND: url(/images/icon64_stop.png) no-repeat 10px 10px}.MessageBox TD.blank {PADDING-RIGHT: 20px; PADDING-LEFT: 20px; PADDING-BOTTOM: 10px; PADDING-TOP: 10px; HEIGHT: 40px; TEXT-ALIGN: center}.hightlight {PADDING-RIGHT: 3px; PADDING-LEFT: 3px; BACKGROUND: #ffff00; TEXT-DECORATION: underline}.banned {COLOR: #ff0000}.mod {COLOR: #000000}.filter {COLOR: #0000ff}.pageArea {PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; WIDTH: 330px; COLOR: #006efe; PADDING-TOP: 5px; TEXT-ALIGN: left}.pageArea IMG {CURSOR: pointer}.pageArea A {DISPLAY: inline-block; WIDTH: 30px; HEIGHT: 16px}.pageArea .pageFirst {BACKGROUND: url(/images/firstpage.gif) no-repeat center center}.pageArea .pagePrevious {BACKGROUND: url(/images/previouspage.gif) no-repeat center center}.pageArea .pageNext {BACKGROUND: url(/images/nextpage.gif) no-repeat center center}.pageArea .pageLast {BACKGROUND: url(/images/lastpage.gif) no-repeat center center}.pageArea .pageFirstDisable {BACKGROUND: url(/images/firstpage_disable.gif) no-repeat center center}.pageArea .pagePreviousDisable {BACKGROUND: url(/images/previouspage_disable.gif) no-repeat center center}.pageArea .pageNextDisable {BACKGROUND: url(/images/nextpage_disable.gif) no-repeat center center}.pageArea .pageLastDisable {BACKGROUND: url(/images/lastpage_disable.gif) no-repeat center center}.pageArea .pageGoto {BACKGROUND: url(/images/green_arrow.gif) no-repeat center center; WIDTH: 17px}
另图片夹作为附件上传，将以上文件放在同目录下，用IE打开test.html即可运行查看效果
页:
[1]