JS实现左右移动功能!哪位高手呀,用JS实现Excel表格的纵坐标左右移动功能!需要代码,急

解决方案 »

  1.   

    <!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 name="author" content="CoLee" />
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <meta name ="keywords" content="" />
    <meta name="description" content=""/>
    <title>可拖动拉伸的左右分栏效果</title>
    <script   language="javascript">     
      var   isResizing=false;   
      function   Resize_mousedown(event,obj){   
      obj.mouseDownX=event.clientX;   
      obj.leftTdW=obj.previousSibling.offsetWidth;   
      obj.setCapture();   
      isResizing=true;   
      }   
      function   Resize_mousemove(event,obj){   
      if(!isResizing)   return   ;   
              var   newWidth=obj.leftTdW*1+event.clientX*1-obj.mouseDownX;   
              if(newWidth>0)   obj.previousSibling.style.width   =   newWidth+'px';   
              else   obj.previousSibling.style.width=1+'px';   
      }   
      function   Resize_mouseup(event,obj){   
      if(!isResizing)   return;   
      obj.releaseCapture();   
      isResizing=false;   
      }   
      function   Resize_setDefault(event,obj){   
      if(obj.innerText=="<")   {   
      obj.parentNode.previousSibling.style.width=1+'px';   
      obj.innerText=">";   
      }   
      else{   
      obj.parentNode.previousSibling.style.width=150+'px';   
      obj.innerText="<";   
      }   
      event.cancelBubble=true;   
      }   
      </script>
    <style>
    html, body {
    margin:0;
    padding:0;
    height:100%;
    }
    </style>
    </head>
    <body>
    <table   style="width:100%;height:100%;"   border=0     cellspacing=0   cellpadding=0px   >
      <tr>
        <td   style="width:150px;"   > 左边 </td>
        <td   style="width:3px;cursor:e-resize;background-color:#cccccc;"   align="center"   valign="middle"   
                onmousedown="Resize_mousedown(event,this);"   onmouseup="Resize_mouseup(event,this);"   onmousemove="Resize_mousemove(event,this);"><font   style="size:3px;background-color:#eeeeee;cursor:pointer;"   onmousedown="Resize_setDefault(event,this);"><</font></td>
        <td> 右边 </td>
      </tr>
    </table>
    </body>楼主,看这样成不?
      

  2.   

    提供思路
    假设初始坐标为(0,0)
    首先要算出表格的最大最小坐标  即(0到maxX,0到maxY) 
    ( maxX = table.rows[0].cells.length ,maxY = tableID.rows.length )
    再去监听上下左右的key值 
    触发事件 就去计算坐标 (不能超过最大最小坐标)*坐标 就是对应这个 tableID.rows[y].cell[x];