Skip to content

Latest commit

 

History

History
47 lines (32 loc) · 854 Bytes

README.md

File metadata and controls

47 lines (32 loc) · 854 Bytes
Raw

Image Zoom JS

Description coming soon.

 

Demo

https://alecrios.github.io/image-zoom-js/

 

Features

  • Lightweight
  • No dependencies
  • Performant
    • Animates only transform and opacity
    • Utilizes CSS transitions
  • Customizable
    • Very minimal CSS
    • Easy to change backdrop color, animation speed, etc

 

Development

This project is still under development and not production-ready. It is written in ES2015, so it needs to be compiled with something like Babel for better browser support.

 

Usage

  1. Include image-zoom.css.
<link href="css/image-zoom.css" rel="stylesheet">
  1. Include image-zoom.js.
<script src="js/image-zoom.js"></script>
  1. Add the data-zoom-image attribute to an <img>.
<img src="img/fruit.jpg" data-zoom-image>