Skip to content
πŸ” Image zoom that makes sense.
Branch: master
Clone or download
Latest commit 4ebe6a2 Mar 20, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github/ISSUE_TEMPLATE Delete ISSUE_TEMPLATE.md Jan 19, 2019
assets/img Remove option defaultZoomable #68 Apr 7, 2018
build Upgrade rollup Jan 24, 2019
cypress
docs
examples Update docs Apr 8, 2018
src Clean up Jan 19, 2019
.babelrc Add babel-plugin-transform-object-assign package back to make the zoo… Feb 19, 2018
.eslintignore finally, a build script that does not suck Dec 24, 2016
.eslintrc.json
.gitignore Update npm test command Apr 3, 2018
.npmignore Add .babelrc to .npmignore #54 Feb 19, 2018
.travis.yml
LICENSE Update LICENSE Jan 21, 2018
README.md
cypress.json Add simple cypress test Apr 2, 2018
index.html Remove no grab option on demo page Apr 9, 2018
package.json Merge pull request #143 from kingdido999/renovate/cypress-3.x Mar 20, 2019
renovate.json
rollup.config.js
rollup.config.min.js
yarn.lock Merge pull request #143 from kingdido999/renovate/cypress-3.x Mar 20, 2019

README.md

Zooming npm

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.

If you're interested in maintaining this project, feel free to say hi here!

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 飴村.

You can’t perform that action at this time.