Demo 1 Zoom on face when mouseover
- 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
- 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
- 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
- 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
- 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: