Demo 1 Zoom on face when mouseover

Features
  • All demos replace an image with an HTML5 canvas
  • 'Mouseover' triggers this image's zoom
  • Has editor, so you can click the magnifying glass and edit options
  • Centered on the face
  • Uses interpolator:
Code:

Demo 2 Unique zoom on face

Features
  • Has editor, so you can click the magnifying glass and edit options
  • Uses width, height to set an exact size
  • Uses interpolator:
Code:

Demo 3 Automatically Zoom repeatedly

Features
  • Proportions of editor are constrained
  • Has editor, so you can click the magnifying glass and edit options
  • Centered on the face
  • Mouseover image to zoom
  • Uses interpolator:
Code:

Demo 4 Does different zoom for each button clicks

Features
  • No event is set
  • Zooming options are updated, then called with API
  • Changes Interpolator on the fly
  • No width/height is set for the image unlike doge example, which means if image size is resized by browser the location of the zoom will be different
  • Calls the doZoom() function
Code:

Demo 5 Zoom in slowly on click

Features
  • Editor is disabled
  • Click is the event used
  • Zooms slowly
  • For another example of no editor on a separate page see this example
  • Uses interpolator:
Code: