Embed A Powerful PDF Viewer Using The jQuery.pdfviewer Plugin
File Size: | 96.8 KB |
---|---|
Views Total: | 463 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

A simple, lightweight jQuery plugin that lets you embed a fully functional PDF viewer in your document.
Built on top of Mozilla's robust pdf.js engine, it comes with a range of user-friendly controls for page navigation, zooming, and printing, as well as downloading the PDF.
How to use it:
1. Load the necessary jQuery and pdf.js libraries from a CDN.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/cdn/pdf.min.js"></script>
2. Download and load the jQuery.pdfviewer plugin's files.
<link rel="stylesheet" href="css/pdfviewer.jquery.css" /> <script src="js/pdfviewer.jquery.js"></script>
3. Create an empty container to hold your PDF viewer.
<div id="pdfviewer"></div>
4. Initialize the plugin and specify the path to the PDF file.
$('#pdfviewer').pdfViewer('file.pdf');
5. Set the size of the PDF viewer.
$('#pdfviewer').pdfViewer('file.pdf',{ width: 900, height: 600, });
6. The filename option allows saving the PDF with a custom name on download. The example uses date values to create a unique name.
$('#pdfviewer').pdfViewer('file.pdf',{ filename: "DOCUMENT_" + date.getDay() + '_' + date.getMonth() + '_' + date.getFullYear(), });
7. The isBase64 flag indicates if the document Url contains a base64 encoded PDF data. Set to true for base64 files.
$('#pdfviewer').pdfViewer('file.pdf',{ isBase64: true, });
This awesome jQuery plugin is developed by algotrader2023. For more Advanced Usages, please check the demo page or visit the official website.