Zooming

Image zoom that makes sense.

• Pure JavaScript & built with mobile in mind.
• Smooth animations with intuitive gestures.
• Zoom into a hi-res image if supplied.
• Easy to integrate & customizable.

Zooming 2.0.0 has been released with two breaking changes, please read the Release Notes carefully before upgrade.

Get Started

Try Demo or play with codepen.

Please see Documentation for detailed guide.

Showcase

These projects are using Zooming. Pull requests are welcome!

• atogatari: share and discover your favorite anime characters.
• FlowChat: an open-source, self-hostable, live-updating discussion platform.
• conference-one: an one page, Bootstrap 4 template, suitable for academic conferences and events.
• OctoberCMS Zooming Images plugin: open source plugin for October CMS.
• Chalk: a high quality, completely customizable, performant and 100% free Jekyll blog theme.

Caveats / Limitations

• Avoid working with fixed position images #34.
• Image won't be visible after zoom-in if any parent element has style overflow: hidden #22.

Contributing

Fork it. Under project folder:

yarn
yarn start

Open up index.html in browser.

Make your changes and submit a pull request!

Test

yarn test

Credit

Inspired by zoom.js and zoomerang. First demo image from Journey. Second demo image journey by 飴村.