Image Resizer

Image Resizer

body { background-color: #f8f9fa; } .container { margin-top: 50px; } #output { display: none; } document.getElementById('resizeButton').addEventListener('click', () => { const width = document.getElementById('widthInput').value; const height = document.getElementById('heightInput').value; const imageInput = document.getElementById('imageInput'); const outputImage = document.getElementById('outputImage'); const downloadButton = document.getElementById('downloadButton'); if (imageInput.files.length > 0) { const file = imageInput.files[0]; const reader = new FileReader(); reader.onload = function (e) { outputImage.src = e.target.result; outputImage.style.width = width + 'px'; outputImage.style.height = height + 'px'; output.style.display = 'block'; downloadButton.href = e.target.result; }; reader.readAsDataURL(file); } });