Concise Fullscreen Image & PDF Viewer Plugin - jQuery EZView

EZView is a small, unobtrusive, convenient jQuery image & PDF viewer plugin that opens and displays image and PDF files in a fullscreen modal popup.

Features image zoom, image pan and prev/next navigation. It means that the visitors are able to switch between images and PDFs without the need of clicking the files one by one.

How to use it:

1. Include the necessary jQuery library and EZView.js on the webpage.

<script src="https://code.jquery.com/jquery-3.3.1.min.js" 
        integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" 
        crossorigin="anonymous">
</script>
<script src="EZView.js"></script>

2. Include the draggable.js plugin if you want to enable the image pan functionality when the images is zoomed.

<script src="draggable.js"></script>

3. Add images and PDF files to your webpage. Note that you need to specify the PDF file in the img's href attribute as these:

<img src="1.png" alt="">
<img src="pdf-thumb-1.png" 
     href="pdf-1.pdf"
>
<img src="2.png" alt="">
<img src="pdf-thumb-2.png" 
     href="pdf-2.pdf"
>
<img src="3.png" alt="">
<img src="pdf-thumb-3.png" 
     href="pdf-3.pdf"
>
...

4. Activate the image & PDF viewer by calling the function on the img tag. That's it.

$(function(){

  $('img').EZView();

});

Changelog:

2019-04-12

• Change container class to avoid conflicts

2019-01-18

• JS update

2019-01-17

• Fix some navigation issues

2018-09-17

• Now you can re-initialize the EZView

---

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