Author: | Spiderpig86 |
---|---|
Views Total: | 2,942 views |
Official Page: | Go to website |
Last Update: | October 28, 2018 |
License: | MIT |
Preview:

Description:
focus.js is an ES6/Vanilla JavaScript plugin to provide smooth interactive image inner zoom functionality that reacts to mouse movement.
Works both with browser and Node.js.
How to use it:
Install and import the ‘focus.js’ package.
import FocusImage from './src/focus'
Create a container element to hold your image.
<div id="demo"></div>
Create a new FocusImage instance to activate the image zoom.
let config = { imageSrc: 'bg.jpg', parentElement: CONTAINER-ELEMENT, }; new FocusImage(config);
All default options to customize the focus.js.
let config = { // zoom factor zoomFactor: '250%', // more smooth smoother: true, // width/height of parent container width: '100%', height: '66.7%', // custom cursor when hovering over cursor: '', // zoom on scroll zoomOnScroll: true };
Changelog:
10/28/2018
- Updated build, fixed src library code that was overwritten with dist