KODE HTML KOTAK BORDER UNTUK SALIN TEKS LANGSUNG

Berikut ini adalah cara membuat kotak teks sederhana dengan tombol “Salin” (copy to clipboard). 

Salin

<!-- Kotak Copy -->
<div style="position: relative; background:#e8fbe8; border:1px solid #33cc33; padding:15px; border-radius:6px; font-family:monospace; color:#006600;">
  <button onclick="copyTeks()" style="position:absolute; top:10px; right:10px; padding:5px 10px; background:#33cc33; color:#fff; border:none; border-radius:4px; cursor:pointer;">
    Salin
  </button>
  <pre id="salin">
isi teks yang ingin disalin di sini.
  </pre>
</div>

<script>
function copyTeks() {
  var text = document.getElementById("salin").innerText;
  navigator.clipboard.writeText(text).then(function() {
    alert("Berhasil disalin!");
  });
}
</script>

Blog ini tidak memasang iklan. Jika Tuan dan Nona berkenan, bisa dukung blog ini dengan menraktir kopi. Terima kasih. ^_^