>  기사  >  웹 프론트엔드  >  JavaScript에서 첫 번째 행과 열이 잠긴 스크롤 가능한 테이블을 만드는 방법은 무엇입니까?

JavaScript에서 첫 번째 행과 열이 잠긴 스크롤 가능한 테이블을 만드는 방법은 무엇입니까?

Susan Sarandon
Susan Sarandon원래의
2024-11-01 23:57:29385검색

How to Create a Scrollable Table with Locked First Row and Column in JavaScript?

스크롤 가능한 테이블에서 첫 번째 행과 첫 번째 열 잠금

이 쿼리에서 사용자는 다음과 유사하게 첫 번째 행과 첫 번째 열이 잠긴 테이블을 생성하려고 합니다. Excel의 "창 고정" 기능. 테이블은 가로 및 세로 스크롤을 모두 허용해야 합니다.

이를 달성하려면 CSS만으로는 충분하지 않으며 JavaScript 솔루션을 탐색해야 합니다. 권장되는 솔루션 중 하나는 "fixed-table-rows-cols"라는 JavaScript 플러그인입니다.

Fixed-Table-Rows-Cols 플러그인

이 플러그인은 형식이 지정된 HTML 테이블을 스크롤 가능한 테이블로 변환합니다. 고정된 테이블 헤더와 열. 첫 번째 행과 열을 잠글 수 있습니다.

용도:

$('#myTable').fxdHdrCol({
    fixedCols    : 3,       // Number of fixed columns
    width        : "100%",  // Width of the container
    height       : 500      // Height of the container
});

이점:

  • 열 및 헤더의 유연한 잠금 허용
  • 다양한 테이블 크기 지원
  • 주요 웹 브라우저에서 작동

자세한 내용과 라이브 데모를 보려면 플러그인의 GitHub를 방문하세요. 저장소: https://github.com/meetselva/fixed-table-rows-cols

위 내용은 JavaScript에서 첫 번째 행과 열이 잠긴 스크롤 가능한 테이블을 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.