Skip to content

Instantly share code, notes, and snippets.

@mcraz
Created January 12, 2014 07:21
Show Gist options
  • Save mcraz/8381901 to your computer and use it in GitHub Desktop.
Save mcraz/8381901 to your computer and use it in GitHub Desktop.
Preview image on upload
<!-- Source : http://stackoverflow.com/questions/14069421/in-html5-how-to-show-preview-of-image-before-upload -->
<img id="uploadPreview" style="width: 100px; height: 100px;" />
<input id="uploadImage" type="file" name="myPhoto" onchange="PreviewImage();" />
<script type="text/javascript">
function PreviewImage() {
var oFReader = new FileReader();
oFReader.readAsDataURL(document.getElementById("uploadImage").files[0]);
oFReader.onload = function (oFREvent) {
document.getElementById("uploadPreview").src = oFREvent.target.result;
};
};
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment