resize image before upload using javascript
<p>Hi i have muliple image uploader with preview using javascript ..</p>

<p>But the problem is i can't resize the images when it's loaded ..</p>

<p>That is my code :</p>

<pre><code>function handleFileSelect(evt) {
    var files = evt.target.files; // FileList object

// Loop through the FileList and render image files as thumbnails.
for (var i = 0, f; f = files[i]; i++) {

    // Only process image files.
    if (!f.type.match('image.*')) {
        continue;
    }

    var reader = new FileReader();

    // Closure to capture the file information.
    reader.onload = (function (theFile) {
        return function (e) {
            // Render thumbnail.
            var span = document.createElement('span');
            //That's what i tried
            e.target.result.height=770;
            e.target.result.width=336;
            span.innerHTML = ['&lt;img class="thumb" src="', e.target.result,
                '" title="', escape(theFile.name), '"/&gt;'].join('');
            document.getElementById('list').insertBefore(span, null);
        };
    })(f);

    // Read in the image file as a data URL.
    reader.readAsDataURL(f);
}
}

document.getElementById('files').addEventListener('change', handleFileSelect, false);
</code></pre>

<p>Please if someone can help me.</p>