hasil pencarian Qr kode generator script
kode Script membuat Qr kode generator tool terbaru!
Salin dan tempel kode script Qr kode generator tool ini di blog kamu,lihat kode script di bawah..
klik untuk menyalin
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QR Code Generator + Download</title>
<script src="https://cdn.jsdelivr.net/npm/qrcodejs/qrcode.min.js"></script>
<style>
body {
font-family: sans-serif;
padding: 20px;
background: #f0f0f0;
text-align: center;
}
input, button {
padding: 10px;
font-size: 16px;
margin: 8px;
width: 80%;
max-width: 400px;
}
#qrcode {
margin-top: 20px;
}
#downloadBtn {
display: none;
margin-top: 10px;
background-color: #28a745;
color: white;
border: none;
cursor: pointer;
}
</style>
</head>
<body>
<h2>🔳 QR Code Generator + Download</h2>
<input type="text" id="qrtext" placeholder="Masukkan teks atau link di sini...">
<br>
<button onclick="generateQRCode()">🔄 Buat QR Code</button>
<br>
<button id="downloadBtn" onclick="downloadQR()">⬇️ Download PNG</button>
<div id="qrcode"></div>
<script>
let qrcode;
function generateQRCode() {
const input = document.getElementById("qrtext").value;
const qrcodeContainer = document.getElementById("qrcode");
const downloadBtn = document.getElementById("downloadBtn");
if (input.trim() === "") {
alert("Silakan masukkan teks dulu, Pak 😅");
return;
}
// Hapus QR sebelumnya
qrcodeContainer.innerHTML = "";
// Generate baru
qrcode = new QRCode(qrcodeContainer, {
text: input,
width: 200,
height: 200,
colorDark: "#000000",
colorLight: "#ffffff",
correctLevel: QRCode.CorrectLevel.H
});
// Tampilkan tombol download setelah QR dibuat
setTimeout(() => {
downloadBtn.style.display = "inline-block";
}, 500);
}
function downloadQR() {
const qrCanvas = document.querySelector("#qrcode canvas");
if (!qrCanvas) {
alert("QR Code belum dibuat!");
return;
}
const link = document.createElement("a");
link.href = qrCanvas.toDataURL("image/png");
link.download = "qr-code.png";
link.click();
}
</script>
</body>
</html>
Komentar untuk Qr kode generator script
Posting Komentar