Embed A Powerful PDF Viewer Using The jQuery.pdfviewer Plugin
| File Size: | 96.8 KB |
|---|---|
| Views Total: | 5783 |
| 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.










