Embed A Powerful PDF Viewer Using The jQuery.pdfviewer Plugin

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

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.


5. Set the size of the PDF viewer.

  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.

  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.

  isBase64: true,

This awesome jQuery plugin is developed by algotrader2023. For more Advanced Usages, please check the demo page or visit the official website.