1. 如何將pdf轉html5
目前各大瀏覽器對PDF文檔的在線預覽都是一件很頭疼的事情,但是各大瀏覽器對HTML5的支持已經相當不錯了。今天給大家介紹一款PDF轉HTML5的工具,可以將PDF文檔轉為HTML5,這樣可以將轉好的文檔發布到站點,在線預覽會很方便,而且還有很多交互效果。
工具/原料
FlipPDFProfessional
方法/步驟
FlipPDFProfessional是一款國外的工程師開發的軟體,可以網路下載。
安裝完成後,點擊「Import PDF」,導入需要轉換的PDF文檔。
等待導入完成,導入完成後會提供前幾頁的預覽效果。
如果確認需要轉換,點擊「Convert to Filpping Book",選擇你需要保存的目錄,點擊「Convert」開始轉換,文件轉換時間視文檔的大小而定,如果文件較大,轉換時間會稍微長一些。
等待轉換完成,轉換完成後的效果如圖。
在你保存的目錄中找到你保存的文件,直接打開就可以通過瀏覽器直接進行預覽,而且效果很不錯。
2. 用html5的pdf.js打開pdf時,報錯Error: 無效或損壞的PDF文件,但是文件是好的,可以直接打開顯示
你換個PDF試試,我用的挺好的
3. 怎麼使用js,html5在瀏覽器直接打開pdf文檔
<html>
<body>
<div>
<button id="prev" onclick="goPrevious()">Previous</button>
<button id="next" onclick="goNext()">Next</button>
<span>Page: <span id="page_num"></span> / <span id="page_count"></span></span>
</div>
<div>
<canvas id="the-canvas" style="border:1px solid black"></canvas>
</div>
<!-- Use latest PDF.js build from Github -->
<script type="text/javascript" src="https://raw.github.com/mozilla/pdf.js/gh-pages/build/pdf.js"></script>
<script type="text/javascript">
//
// NOTE:
// Modifying the URL below to another server will likely *NOT* work. Because of browser
// security restrictions, we have to use a file server with special headers
// (CORS) - most servers don't support cross-origin browser requests.
//
var url = 'http://cdn.mozilla.net/pdfjs/tracemonkey.pdf';
//
// Disable workers to avoid yet another cross-origin issue (workers need the URL of
// the script to be loaded, and currently do not allow cross-origin scripts)
//
PDFJS.disableWorker = true;
var pdfDoc = null,
pageNum = 1,
scale = 0.8,
canvas = document.getElementById('the-canvas'),
ctx = canvas.getContext('2d');
//
// Get page info from document, resize canvas accordingly, and render page
//
function renderPage(num) {
// Using promise to fetch the page
pdfDoc.getPage(num).then(function(page) {
var viewport = page.getViewport(scale);
canvas.height = viewport.height;
canvas.width = viewport.width;
// Render PDF page into canvas context
var renderContext = {
canvasContext: ctx,
viewport: viewport
};
page.render(renderContext);
});
// Update page counters
document.getElementById('page_num').textContent = pageNum;
document.getElementById('page_count').textContent = pdfDoc.numPages;
}
//
// Go to previous page
//
function goPrevious() {
if (pageNum <= 1)
return;
pageNum--;
renderPage(pageNum);
}
//
// Go to next page
//
function goNext() {
if (pageNum >= pdfDoc.numPages)
return;
pageNum++;
renderPage(pageNum);
}
//
// Asynchronously download PDF as an ArrayBuffer
//
PDFJS.getDocument(url).then(function getPdfHelloWorld(_pdfDoc) {
pdfDoc = _pdfDoc;
renderPage(pageNum);
});
</script>
</body>
</html>