Javascript, scale image down

Asked May 23 '16 at 16:12

Active May 23 '16 at 16:12

Viewed 478 times

I am using a plugin named Darkroom.js to crop images. The Problem is that if the quality of the chosen images is to good, the plugin works to slowly.

function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();

reader.onload = function(e) {
  $('#seite6_vorschau').attr('src', e.target.result);
  darkroomcrop();
}

reader.readAsDataURL(input.files[0]);
}
}

//--Eventlistener--//
$("#seite6_imageinput").change(function() {
readURL(this);
});

When the user chose an image the Eventlistener starts the function readURL, this function gives the HTML img-tag the chosen image. Then this function starts my crop-function Darkroom.js. This function handles with the image of the img-tag. Now I want that the readURL function always scales the image at an given size (for Example: 300px height and the width auto) and then gives the image to the HTML img-tag. Then the Plugin can work fast and smothly.

How can I do that?

asked May 23 '16 at 16:12

Number_987

May be `canvas`..Not too sure... – Rayon May 23 '16 at 16:13
Draw the image on canvas and then resize the canvas... – Rayon May 23 '16 at 16:15
http://stackoverflow.com/questions/2303690/resizing-an-image-in-an-html5-canvas – Daniel Beck May 23 '16 at 16:16
Ok so I have to make an extra canvas tag? – Number_987 May 23 '16 at 16:20

Javascript, scale image down

0 Answers0