<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=euc-kr">
<style>
.ellipsis {font:9pt "굴림"; width:100%; overflow:hidden; text-overflow:ellipsis; text-align:left; }
.colresize {font:9pt "굴림"; cursor:""; }
.input_box {width:expression(this.parentNode.clientWidth-8); }
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
// 자료출처 : phpschool.com ==> kisses
var mousedown = false; //마우스를 누른 상태
var td = ""; //사이즈 변경할 td
var td_width; //변경할 td의 width,
var x = 0; //마우스 드레그전 가로위치
function TCstartColResize(obj){
mousedown = true;
td = obj;
td_width = td.width;
x = event.clientX;
}
function TCColResize()
{
if (mousedown){
var distX = event.x - x; //이동한 간격
td.width = parseInt(td_width) + parseInt(distX);
}
}
function TCstopColResize(){
mousedown = false;
td = '';
}
function cell_left(obj){//마우스가 셀의 왼쪽인지 측정
if(event.offsetX < 5 && obj.cellIndex!=0)
return true;
else
return false;
}
function cell_right(obj){//마우스가 셀의 오른쪽인지 측정
if(event.offsetX > obj.width-4)
return true;
else
return false;
}
//리사이즈시작
document.onmousedown = function(){
try{
var now_mousedown = window.event.srcElement;
if(now_mousedown.className.toUpperCase()=="COLRESIZE"){
if( cell_left(now_mousedown) ){
now_mousedown = now_mousedown.parentNode.childNodes[now_mousedown.cellIndex-1];
}else if( !cell_right(now_mousedown) ){
return true;//오른쪽도 왼쪽도 아니면 사이즈 조절 안함
}
TCstartColResize(now_mousedown);
}
}catch(e){ return true; }
}
//리사이즈
document.onmousemove = function(){
try{
var now_mousemove = window.event.srcElement;
if(now_mousemove.className.toUpperCase()=="COLRESIZE" || td!=""){
//셀의 가장자리면 마우스 커서 변경
if( cell_left(now_mousemove) || cell_right(now_mousemove) ){
now_mousemove.style.cursor = "col-resize";
}else{
now_mousemove.style.cursor = "";
}
TCColResize(now_mousemove);
}else{
now_mousemove.style.cursor = "";
}
}catch(e){ return true; }
}
//리사이즈종료
document.onmouseup = function(){
try{
var now_mouseup = window.event.srcElement;
//if(now_mouseup.className=="colResize"){
TCstopColResize(now_mouseup);
//}
}catch(e){ return true; }
}
//리사이즈 도중 텍스트 선택 금지
document.onselectstart = function(){
try{
if(td != ""){
return false;
}
}catch(e){ return true; }
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<div style="width:100%;height:100;overflow-x:auto;overflow-y:auto">
<table width="430" border="0" cellpadding="3" cellspacing="1" bgcolor="#B8B8B8" nowrap style='table-layout:fixed'>
<tr bgcolor="#A5D4D2" align="center" height="25">
<td width="35" class="colresize">선택</td>
<td width="35" class="colresize">순번</td>
<td width="70" class="colresize">품목명</td>
<td width="30" class="colresize">수량</td>
<td width="50" class="colresize">단위</td>
<td width="70" class="colresize">날짜</td>
<td width="70" class="colresize">장소</td>
<td width="70" class="colresize">비고</td>
</tr>
<tr bgcolor="#FFFFFF" height="27" align="center">
<td><Input type="radio" name="radio"></td>
<td>1</td>
<td><input type='text' class="input_box"></td>
<td><input type='text' class="input_box"></td>
<td><select class="input_box"><option>EA</option></select></td>
<td><input type='text' class="input_box"></td>
<td><input type='text' class="input_box"></td>
<td nowrap class="ellipsis">비고 비고 비고 비고 비고 비고 비고 비고 비고</td>
</tr>
</table>
</div>
</BODY>
</HTML>
