Jquery 크기 조정 테이블 헤더 열

Question

jquery 테이블 헤더 열의 크기를 조정하려고합니다. 단일 테이블에서 할 수 있지만 고정 된 테이블 머리글 머리글 경우 수행 할 수 없습니다.

내 jsfiddle 시험

은 다음과 같습니다 :

With Single Table Header:

With Fixed Table Header:

어떻게 일 텍스트의 끝에서 크기 조절 포인터로 고정 테이블 헤더 작업을 할 수 있습니까?

$(function() { 
    var pressed; 
    var start; 
    var startX; 
    var startWidth; 
    var wrapper = $("div#wrapper"); 
    var container = $("table#fixedHeaderTable"); 

    $("table th").mousedown(function(e) { 
     start = $(this); 
     startX = e.pageX; 
     startWidth = $(this).width(); 
     $(start).addClass("resizing"); 
     pressed = true; 
    }); 

    $(document).mousemove(function(e) { 
     if(pressed) { 
      var newWidth = startWidth + (e.pageX - startX); 
      start.width(newWidth); 
      wrapper.width(container.width() + 10); 
     } 
    }); 

    $(document).mouseup(function() { 
     if(pressed) { 
      $(start).removeClass("resizing"); 
      pressed = false; 
     } 
    }); 
}); 

Answer 1

작성한 코드가 약간 수정되었습니다. fiddle

코드에 다음 줄을 추가했습니다. 도움이 되었으면 좋겠다.

contentColumn = $('#contentsTable').find('td').eq($(this).index()); 

contentColumn.width(newWidth);