Skip to content

kruppel/zoom.js

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

ZOOM.JS

A simple jQuery plugin for image zooming; as seen on Medium.

Demo

https://fat.github.io/zoom.js

How

  1. Link the zoom.js and zoom.css files to your site or application.
<link href="css/zoom.css" rel="stylesheet">
<script src="js/zoom.js"></script>
  1. zoom.js is dependent on transition.js file from Bootstrap, so make sure to include that as well.
<script src="js/transition.js"></script>
  1. Add a data-action="zoom" attribute to the images you want to make zoomable. For example:
<img src="img/blog_post_featured.png" data-action="zoom">

Why

It's the best way to zoom an image. It transitions/zooms in really smoothly, and then when you're done, scrolls away, [esc] keys away, clicks away… clean af.

Also, now if you hold your meta key (), it will open in a new tab. wow.

Where

zoom.js should (in theory) work in all relevant browsers. If not, create an issue! Thanks!

Who

Written by @fat, made better by you.

About

Medium's Image Zoom for jQuery

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 66.0%
  • HTML 30.1%
  • CSS 3.9%