Author: | hakimel |
---|---|
Views Total: | 204 views |
Official Page: | Go to website |
Last Update: | September 20, 2022 |
License: | MIT |
Preview:

Description:
zoom.js is a lightweight JavaScript zooming library that enables users to zoom in on any DOM element in your document.
How to use it:
1. Download and import zoom.js.
<script src="js/zoom.js"></script>
2. Zoom in on an element within the document.
zoom.to({ element: document.querySelector('#element'), });
3. Zoom in on a specified portion of a web page.
zoom.to({ x: 100, y: 200, width: 400, height: 300, }); // OR zoom.to({ x: 100, y: 200, scale: 3, });
4. Set the space around the element.
zoom.to({ element: document.querySelector('#element'), padding: 10, });
5. Trigger a function after zooming in on an element.
zoom.to({ element: document.querySelector('#element'), callback: function() { // do something } });
6. This example shows how to zoom in on an element when getting clicked.
document.querySelector( 'body' ).addEventListener( 'click', function( event ) { event.preventDefault(); zoom.to({ element: event.target }); });