Create a file upload input that displays a preview of the selected image before upload.
Usage
Ideal for:
- User profile images
- Product image uploads
- Featured image previews
<input
type="file"
id="image"
accept="image/*">
<br><br>
<img
id="preview"
width="250">
<script>
document
.getElementById('image')
.addEventListener('change',function(){
const file=this.files[0];
if(file){
document.getElementById('preview').src=
URL.createObjectURL(file);
}
});
</script>
