任意点击增加宽度.doc

任意点击增加宽度bodymargin:0px; height:100%;font:12px /120% Arial;background:#fff;text-align:center;ul,limargin:0px; padding:0px; list-style-type:none;#leftwidth:185px; height:100%; background-color:#CAD7E1; position:absolute; left:0;#ovwidth:100%; height:25px; line-height:25px; margin-top:50px; overflow:hidden; border-bottom:solid #999999 1px;#navwidth:100%; height:auto;#nav liwidth:100%; height:30px; line-height:30px; margin-top:10px;#nav li adisplay:block; width:100%; height:30px; line-height:30px;#nav li a:hoverdisplay:block; width:100%; height:30px; line-height:30px; background-color:#CCCCCC;#mainwidth:700px; height:auto; border:1px solid #FF0000; position:absolute; left:200px; top:50px;#main #wo,#hooverflow:hidden; border:1px solid #FFA275; border-left:none; border-right:none;.noeborder:1px solid #FFA275; background-color:#FFDDBB; line-height:25px; margin-bottom:10px;#textswidth:100%; height:25px; line-height:25px; margin-bottom:10px; font-weight:bold;#texts spanfont-weight:normal; color:#FF0000; padding-left:10px;#noe1,#noe2,#noe3display:none;#wowidth:100%; height:130px; margin:6px auto;.woe,.hoebackground-color:#FFC8C8; border:1px solid #FF1E1E;#woe1,#woe2,#woe3width:0px; height:30px; line-height:30px; margin:5px auto; overflow:hidden; display:none#woe2float:left;#woe3float:right; clear:both;#woo1b,#woo2b,#woo3bdisplay:none;#howidth:100%; height:300px; margin:6px auto; position:relative;#hoe1,#hoe2width:600px; margin:0px auto; position:absolute; left:50%; margin-left:-300px;overflow:hidden; display:none#hoe1top:0px;#hoe2bottom:0px;#hoo1b,#hoo2bdisplay:none; left 相关菜单显示增加宽度 中减少宽度 中增加宽度 左减少宽度 左增加宽度 右减少宽度 右增加高度 上减少高度 上增加高度 下减少高度 下动态数据:0显示1.显示2.li1li2widt_a(woe1,601,text,woo1,woo1b)widt_a(woe2,601,text,woo2,woo2b)widt_a(woe3,601,text,woo3,woo3b)heig_a(hoe1,151,text,hoo1,hoo1b)heig_a(hoe2,151,text,hoo2,hoo2b)/* 显示或隐藏类 可设置参数 */function chas(id,boxs,txt,text) var job=document.getElementById(id);var boj=document.getElementById(boxs);if(job.style.display=block) job.style.display=none;boj.innerHTML = text;elsejob.style.display=block;boj.innerHTML = txt;/* 宽度缓冲可设置参数 */var els = 0; /最小宽度或高度var ps = 2;/缓冲变量数字越大速度越慢，0为不用缓冲function widt_a(id,sls,boxs,zs,qs) var obj=document.getElementById(id);/获取ID为box的对象 var box=document.getElementById(boxs);/获取ID为box的对象 var zs=document.getElementById(zs);/获取ID为box的对象 var qs=document.getElementById(qs);/获取ID为box的对象 obj.style.width = els; /设置对象obj的宽度为1px var widta=function() /(关于函数这一点这里我理解的是创建一个函数直接量并把它存进变量changeW里) var obj_width=parseInt(obj.style.width);/把对象的宽度转换为一个数值，并存入变量obj_w中； if(obj_widthels) /判断，如果宽度数值小于600 zs.style.display=none; obj.style.width = obj_width - Math.ceil(obj_width-els)/ps) + px;/计算对象的宽度。随着宽度的变长，递增量越来越小 box.innerHTML = obj_width; else obj.style.width = els + px; obj.style.display=none; qs.style.display=block; clearInterval(bw);/如果大于等于600的话，不再执行setInterval,意思就是这个时候停止增加宽度了。 var bw=window.setInterval(widtb,5)/时间变量/* 高度缓冲可设置参数 */function heig_a(id,sls,boxs,zs,qs) var obj=document.getElementById(id);/获取ID为box的对象 var box=document.getElementById(boxs);/获取ID为box的对象 var zs=document.getElementById(zs);/获取ID为box的对象 var qs=document.getElementById(qs);/获取ID为box的对象 obj.style.height = els; /设置对象obj的宽度为1px var heiga=function() /(关于函数这一点这里我理解的是创建一个函数直接量并把它存进变量changeW里) var obj_height=parseInt(obj.style.height);/把对象的宽度转换为一个数值，并存入变量obj_w中； if(obj_heightels) /判断，如果宽度数值小于600 zs.style.display=none; obj.style.height = obj_height - Math.ceil(obj_height-els)/ps) + px;/计算对象的宽度。随着宽度的变长，递增量越来越小 box.innerHTML = obj_height; else obj.style.height = els + px; obj.style.display=none; qs.style.display=block; clearInterval(bw);/如果大于等于600的话，不再执行setInterval,意思就是这个时候停止增加宽度了。 var bw=window.setInterval(heigb,5)/时间变量/*