웹솔루션개발 25년 노하우! 해피CGI의 모든것

* jquery fancyTable fancyTable은 html 테이블을 검색하고 정렬 할 수 있도록하는 jQuery 플러그인입니다. * License MIT License * 이용방법 첨부된 압축파일을 해제하여 원하는 웹경로에 업로드 합니다 css 를 아래와 같이 호출합니다 테이블 html 태그를 구성합니다 (jquery 를 통해 tbody 태그에 테이블 내용이 삽입됩니다) 구성에 필요한 js 파일 및 코드를 삽입합니다 위와 같이 적용된 jquery 를 통해 아래와 같이 테이블 내용이 삽입되고 정렬됨을 확인할 수 있습니다 첨부된 압축파일에도 샘플 파일이 있으니 참고하시면 도움이 되실겁니다 ​ ​

문서내에 존재하는 테이블의 데이터를 엑셀화하여 저장할 수 있습니다. jQuery Plugin 이며, 라이센스는 MIT 입니다. 소스다운을 누르시면 압축 파일을 다운로드 받을 수 있습니다. 압축 해제하셔서 폴더로 들어가면 demo 폴더가 있습니다. index.html 파일은 원본파일이며, happy.html 은 제가 임의로 가공한 파일 입니다. 심플한 코드를 보고 싶다면 happy.html 을 보십시요. 사용법은 매우 심플 합니다. 1. 라이브러리를 호출하세요. 2. 엑셀로 만들 데이터의 테이블을 만들어 주시되 class 명은 맞춰주셔야 합니다. 번호 이름 전화번호 배송지 주문번호 배송메모 1 홍길동1 010-1111-1111 대구 달서구 두류동 776-1 N-192858291-D9S8 문앞에 두시고 문자..

위의 테이블은 css로 반응형 스타일을 주어 작은 화면에서 아래의 이미지와 같이 한줄의 내용이 모두 합쳐져 하나로 출력됩니다. 사이트 또는 첨부파일을 받아보시면 자세한 소스를 확인하실 수 있습니다. 아래의 미디어 쿼리 소스로 700px 이하의 너비에서 내용이 합쳐지도록 조절되며 html 소스는 크게 2부분으로 구성되어 있습니다. 1) 표 타이틀(table head) 2) 표 내용 부분 화면의 너비에 따라 출력되는 타이틀이 다르기 때문에 표 타이틀이 내용부분에서도 반복되는 것을 볼 수 있습니다. 해당 부분을 참고 하셔서 본 반응형 테이블 소스를 유용하게 사용해보세요.

에디터에서 입력한 값을 통해 자동으로 테이블 코드를 생성해주는 사이트입니다. 실제로 디자인 작업을 하는 분께서는 도움이되지 않을수도 있지만 기사 작성이나 html코드 작성이 필요하신분들은 유용할것으로 생각이 됩니다. 다양한 테이블 형태를 선택할 수 있으며 일반적으로 많이 쓰이는 테이블 코딩탭을 클릭하여 사용할 수 있습니다. 위 에디터 항목의 테이블을 선택하여 행 렬을 지정할 수 있습니다. 테이블의 대한 각 각의 속성을 지정한다음 아래의 GENERATE 버튼을 통해 코드를 생성 할 수 있으며 각 각 CSS생성하지 않는 옵션과 할줄로 CSS및 HTML코드를 생성하는 옵션을 선택할 수 있습니다. 생성된 코드는 아래의 창에서 확인가능하며 PREVIEW버튼을 클릭하여 미리보기가 가능합니다.

* ckeditor - Table Resize - 이 플러그인은 에디터에 테이블 태그 삽입시 셀 영역의 사이즈 조절을 도와줍니다. * 라이센스(무료) - GPLV3, LGPL3, MPL * 설치방법 - 플러그인 파일을 다운로드 받아 ckeditor 가 설치된 폴더내 plugins 폴더안에 업로드 합니다. 예) http://example.com/ckeditor/plugins/tableresize - ckeditor 의 설정파일인 config.js 파일을 열어 아래 소스를 추가합니다. config.extraPlugins = 'tableresize'; - 에디터에 테이블 태그를 삽입한 후 셀 영역을 리사이징 할 수 있습니다.