js-zoomable-images

JavaScript and CSS libraries for enabling IIIF-compatible "zoomable" images.

Notice

This package is no longer being updated. It has been superseded by the sfomuseum/webcomponent-zoomable-image package.

Important

The documentation for this package is incomplete. For now, please consult this blog post for details:

• https://millsfield.sfomuseum.org/blog/2020/09/14/js-zoomable/

Example

There are example HTML files demonstrating how to use the zoomable.images JavaScript and CSS files in the example folder.

Directory structure

dist

The dist folder contains copies of the most recent "rollups" for the zoomable.images Javascript and CSS libraries. These can be used in your webpages without any external dependencies.

example

The example folder contains HTML pages demonstrating how to use the zoomable.images libraries. There are examples for the "rolled up" versions as well as the source files used in conjunction with third-party dependencies.

lib

The third-party dependencies used by the zoomable.images JavaScript and CSS libraries.

src

The source files for the zoomable.images JavaScript and CSS libraries.

CSS

zoomable-image-{IMAGE_ID}

zoomable-loading-{IMAGE_ID}

zoomable-map-{IMAGE_ID}

zoomable-static-{IMAGE_ID}

zoomable-tiles-{IMAGE_ID}

zoomable-toggle-tiles-{IMAGE_ID}

Classes

zoomable-button

zoomable-image

zoomable-loading

zoomable-loading-text

zoomable-map

zoomable-picture-default

zoomable-static

zoomable-tiles

zoomable-toggle-tiles

IDs

See also

• https://leafletjs.com/
• https://github.com/Leaflet/Leaflet.fullscreen
• https://github.com/mejackreed/Leaflet-IIIF
• https://github.com/sfomuseum/leaflet-image-control
• https://github.com/mapbox/leaflet-image
• https://github.com/eligrey/FileSaver.js