TableSorter는 HTML 테이블을 정렬하고 필터링하는 JavaScript 플러그인입니다. 이를 사용하여 테이블의 열 너비를 조절하는 방법에 대해 알아보겠습니다.

1. TableSorter 라이브러리 호출하기

먼저, TableSorter 라이브러리를 HTML 문서에 추가합니다. 아래는 CDN을 통해 라이브러리를 호출하는 예시입니다.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.34.6/js/jquery.tablesorter.min.js"></script>

2. 테이블에 TableSorter 적용하기

HTML 테이블에 TableSorter 플러그인을 적용합니다. 이를 위해 .tablesorter() 메서드를 호출합니다.

$(document).ready(function(){
  $("#myTable").tablesorter();
});

3. 열의 너비 조절하기

TableSorter는 기본적으로 열의 너비를 자동으로 조절합니다. 그러나 사용자가 직접 열의 너비를 조절하고 싶다면 resize: true 옵션을 사용할 수 있습니다.

$(document).ready(function(){
  $("#myTable").tablesorter({
    widthFixed: true, // 테이블의 너비를 고정합니다.
    widgetOptions : {
      resizable: true // 열의 너비를 조절할 수 있도록 합니다.
    }
  });
});

위의 예시에서, resizable: true 옵션을 사용하여 사용자가 열의 너비를 조절할 수 있도록 허용했습니다.

이제 TableSorter를 사용하여 HTML 테이블의 열 너비를 조절할 수 있습니다!

참고문헌:

• TableSorter 공식 문서
• jQuery CDN