Skip to content
Andrew Hankinson edited this page Nov 1, 2013 · 54 revisions

TABLE OF CONTENTS

Description

Diva.js (Document Image Viewer with AJAX) is a Javascript frontend for viewing documents, designed to work with digital libraries to present multi-page documents as a single, continuous item. Using "lazy loading" methods for loading parts of a document on demand, it presents a quick and efficient way of displaying hundreds (or even thousands) of high-resolution page images from digitized books and other documents on a single web page.

Version 3.0 (released Fall 2013) contains many new features and improvements:

  • Optimized for speed!
  • Simplified setup
  • Expanded and improved API for use in external scripts
  • New demo!
  • Bug fixes (see commit log for details)

To browse through the pages within a document, simply scroll through the document panel using the scrollwheel, the scrollbar, the arrow keys or the page up/page down keys. To zoom in, either move the slider to the right or double-click the document viewer. To zoom out, move the slider to the left or hold control while double-clicking the document viewer. You can enter and subsequently exit fullscreen mode by clicking the icon in the top left corner.

You can find a demo running at http://ddmal.music.mcgill.ca/diva/examples.

There are two main components to a diva.js install:

  • The IIPImage installation, which will serve the images of the pages of the documents
  • The frontend for the document viewer, created using the diva.js jQuery plugin

Additionally, you will need to configure your web server (Apache, Nginx, or similar) to serve JSON files to your JavaScript front-end. For a complete guide, see Installation.