zoom-component

zoom

Zoom in on an image using double click or double tap.

Installation

Install with component(1):

$ component install component/zoom

Example

var zoom = require('zoom');
 
zoom(el, container)
  .duration('1s')
  .scale(5)
  .effect('out-bounce');

Events

• zoom in: called after the element is zoomed in.
• zoom out: called after the element is zoomed out.

API

Zoom(el, container)

Initialize Zoom.

Zoom.duration(n:Number|String)

Set the duration of the zoom. Defaults to 300. Supports guille/ms.js.

zoom.duration('1s') // 1 second
zoom.duration(300) // 300ms

Zoom.scale(n:Number)

Set the scale of the zoom. Defaults to 3

Zoom.effect(effect:String)

Set the effect of the zoom. See the aliases of component/ease for the available effects.

zoom.effect('in-quad');
zoom.effect('out-bounce');

Zoom.in(x:Number, y:Number)

Programmatically zoom in on an element. x and y will be the origin of the zoom.

zoom.in(300, 200)

Zoom.out()

Programmatically zoom out of an element.

zoom.out()

License

MIT