JavaScript Image Resize: Rescale images smoothly using HTML canvas objects

Recommend this page to a friend!
  Info   View files Example   Demos   Screenshots Screenshots   View files View files (3)   DownloadInstall with Composer Download .zip   Reputation   Support forum (1)   Blog    
Ratings Unique User Downloads Download Rankings
Not yet rated by the usersTotal: 188 All time: 269 This week: 4Up
Version License JavaScript version Categories
resizer 1.0.3MIT/X Consortium ...3.0HTML, Graphics
Description Author

This object can rescale images smoothly using HTML canvas objects.

It can take an image given the image object or a selector string of the image element to rescale.

The object can create a canvas to render the image rescaled to a given ratio or to a given size optionally preserving the original image proportions.

The image can be rescaled smoothly if the browser supports the imageSmoothingEnabled property. The smoothing level is configurable.

The object calls a given callback function when the rescaling is done passing the canvas object that contains the rescaled image.

Innovation Award
JavaScript Programming Innovation award winner
June 2015
Winner


Prize: One downloadable e-book of choice by O'Reilly
One way to rescale images on a browser is to use canvas objects and create copies of the original images at different sites.

Modern browsers support a property named imageSmoothingEnabled that can be used to create smooth versions of rescaled images. That property may have a slightly different name depending on the browser type.

This object can create smooth rescaled images on several different browsers that support that feature.

Manuel Lemos
Picture of Andras Toth
  Performance   Level  
Name: Andras Toth <contact>
Classes: 22 packages by
Country: Hungary Hungary
Age: 49
All time rank: 31 in Hungary Hungary
Week rank: 1 Up
Innovation award
Innovation award
Nominee: 15x

Winner: 9x

Screenshots  
  • arion_12000x9000.png
  • Capture.png
  Files folder image Files  
File Role Description
Accessible without login Image file img.jpg Icon image
Accessible without login Plain text file index.html Example presentation
Plain text file resizer.js Class class

 Version Control Unique User Downloads Download Rankings  
 0%
Total:188
This week:0
All time:269
This week:4Up