js create thumbnail of image

by lemon kazi

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" multiple>
<div id="thumbs">

</div>

JavaScript

$('input[type="file"]').on('change', function() {
  for (var i = 0; i < this.files.length; i++) {
    var fr = new FileReader();
    fr.onload = function(e) {
      $('#thumbs').append('<img src="' + e.target.result + '" width="50px" height="50px">')
    }
    fr.readAsDataURL(this.files[i]);
  }
});