[PDFjs] Custom Viewer

2020년 8월 2일
다운로드

https://github.com/cksrlcks/pdfjs-viewer


데모페이지

보러가기


사용방법
<head>
...
<link rel="stylesheet" href="dist/css/uxis-viewer.css" />
...
</head>

<!-- 뷰어가 랜더링 할 곳의 너비/높이에 꽉차게 설정되어있습니다.(w/h 지정 필요)
반응형구현시에는 랜더링할 엘레멘트를 absolute로 만든다음, 
  부모의 컨텐츠 생성후 padding으로 높이를 잡아주세요.-->
<div id="pdf-frame"></div> 
<script src="/dist/js/pdf.min.js"></script>
<script src="/dist/js/pdf.worker.min.js"></script>
<script src="/dist/js/uxis-viewer.min.js"></script>
<script>
  var viewer = new UxisViewer({
    url: "files/sample.pdf",
    target: "#pdf-frame",
  });
</script>

옵션들
{
  url : "파일경로",
  target : "렌더링할 구역의 클래스/아이디/태그명",
  mode : "one 또는 all" // one : 한페이지씩, all : 모든페이지 출력 (기본값 : one)
  color : "컬러코드" // 기본값 : #3d464d;
}