BHAI TOOLS FREE
Pages
Home
Language Translator Tool
html Copy code
PNG to JPG Converter
PNG to JPG Converter
Convert to JPG
Download JPG
CSS (styles.css) css Copy code body { font-family: Arial, sans-serif; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; background: #f5f5f5; } .container { text-align: center; background: white; padding: 20px; border-radius: 10px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); } h1 { color: #333; margin-bottom: 20px; } input[type="file"] { display: block; margin: 20px auto; padding: 10px; font-size: 16px; } button { display: inline-block; padding: 10px 20px; font-size: 16px; color: white; background: #28a745; border: none; border-radius: 5px; cursor: pointer; transition: background 0.3s ease; } button:hover { background: #218838; } #download-link { display: inline-block; margin-top: 20px; padding: 10px 20px; font-size: 16px; color: white; background: #007bff; text-decoration: none; border-radius: 5px; transition: background 0.3s ease; } #download-link:hover { background: #0056b3; } JavaScript (script.js) javascript Copy code document.getElementById('convert-btn').addEventListener('click', function () { const upload = document.getElementById('upload').files[0]; if (!upload) { alert('Please select a PNG file.'); return; } const reader = new FileReader(); reader.readAsDataURL(upload); reader.onload = function (event) { const img = new Image(); img.src = event.target.result; img.onload = function () { const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); canvas.width = img.width; canvas.height = img.height; ctx.drawImage(img, 0, 0); const jpgDataUrl = canvas.toDataURL('image/jpeg', 1.0); const downloadLink = document.getElementById('download-link'); downloadLink.href = jpgDataUrl; downloadLink.download = 'converted-image.jpg'; downloadLink.style.display = 'inline-block'; }; }; });
Newer Post
Older Post
Home
