手机端 阅读 pdf 文件 touchPDF.js

touchpdf 中文API

下载地址： http://github.com/loicminghetti/touchpdf/archive/master.zip

一款在手机端 阅读pdf 文件的 js库，能够 通过滑动进行 pdf 预览 翻页 

TouchPDF是一个jQuery插件，它使用pdf.js短语和呈现支持触摸手势和自动页面选项卡的Web PDF查看器。

依赖关系：

PDF.js

jQuery touchSwipe插件

jQuery panzoom插件

jQuery mousewheel插件

特征：

PDF可以使用滚动，两个手指捏，+/-键和工具栏按钮进行缩放。 

PDF可以使用一根手指刷。 

在文档顶部的工具栏，标题，页码和下一页/上一页和缩放的按钮。 

如何使用它：

1.将jQuery TouchPDF的CSS文件加载到文档的头部。

      <link href="jquery.touchPDF.css" rel="stylesheet" />

2.在文档末尾加载jQuery库，jQuery TouchPDF插件和其他必需的资源。

<script  src="pdf.js"></scrip>

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>

<script src="jquery.touchSwipe.min.js"></script>

<script src="jquery.touchPDF.js"></script>

<script src="jquery.panzoom.js"></script>

<script src="jquery.mousewheel.js"></script>

3.为Web PDF查看器创建一个DOM元素。

<div id="myPDF"></div>

4.初始化插件并指定要在DOM元素中显示的PDF文件的路径。

$(function(){

$("#myPDF").pdf( {   

      source:"demo.pdf",// MORE SETTINGS HERE

   } );

});

5.插件参数设置

//PathofPDF file to display

source:null,

//Titleofthe PDF to be displayedinthe toolbar

title:"TouchPDF",

//Arrayoftabs to displayonthe side.tabs: [],

//Default background colorforall tabs.//Available colors are"green","yellow","orange","brown",//"blue","white","black"andyou can define your own colorswithCSS.tabsColor:"beige",

//Disable zoomingofPDFdocument.disableZoom:false,

//Disable swipe to next/prev pageofPDFdocument.disableSwipe:false,

//Disable all internalandexternal linksonPDFdocumentdisableLinks:false,

//Disable the arrow keysfornext/previous page and +/-forzoomingdisableKeys:false,

//Force resizeofPDF vieweronwindowresizeredrawOnWindowResize:true,

//Show a toolbarontopofthedocumentwithtitle

,//page numberandbuttonsfornext/prev pagesandzoomingshowToolbar:true

,//A handler triggeredwhenPDFdocumentisloadedloaded:null,

//A handler triggered each time anewpageisdisplayedchanged:null,

//TextorHTML displayedonwhite page shown beforedocumentisloadedloadingHeight:841,

//Heightinpxofwhite page shown beforedocumentisloadedloadingWidth:595,

//Widthinpxofwhite page shown beforedocumentisloadedloadingHTML:"Loading PDF"