Skip to content

Sprebecca/zoom.js

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

24 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

zoom.js

Enables a minimal JS API for zooming in on specific points or DOM elements.

Note that this is only a proof of concept so don't use it for anything important. Does not work in IE, yet.

Try out the demo.

Usage

Zoom in on an element:

  zoom.to({
    element: document.querySelector( 'img' )
  });

Additional options:

  zoom.to({
    element: document.querySelector( 'img' ),

    // Amount of empty space around zoomed element
    padding: 20,

    // Function to call once zooming completes
    callback: function() { /* ... */ }
  });

Zoom in on a point:

  zoom.to({
    x: 100,
    y: 200,
    width: 300,
    height: 300
  });
  zoom.to({
    x: 100,
    y: 200,
    scale: 3
  });

Reset

  zoom.out();

License

MIT licensed

Copyright (C) 2017 Hakim El Hattab, http://hakim.se

About

zoom in on any element in the DOM

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 75.3%
  • JavaScript 19.3%
  • CSS 5.4%