Get started with zeroclipboard CDN

MIT licensed

ZeroClipboard: library for rich text editing, enabling copy-paste of text, images, and content.

Tags:
  • flash
  • clipboard
  • copy
  • cut
  • paste
  • zclip
  • clip
  • clippy

Stable version

Copied!

How to start using zeroclipboard CDN


<!DOCTYPE html>
<html>
<head>
  <title>Get started with zeroclipboard CDN - cdnhub.io</title>
  <link rel="stylesheet" href="styles.css">
  <script src="https://cdn.cdnhub.io/zeroclipboard/2.3.0/ZeroClipboard.min.js"></script>
</head>
<body>
  <button id="copy-btn">Copy Text to Clipboard</button>
  <p id="text-to-copy">This is some text to be copied.</p>

  <script>
    const copyBtn = document.getElementById('copy-btn');
    const textToCopy = document.getElementById('text-to-copy');

    const zeroClipboard = new ZeroClipboard.Client('button#copy-btn');

    zeroClipboard.on('dataRequested', function(event) {
      event.clipboardData.setData('text/plain', textToCopy.innerText);
    });

    zeroClipboard.on('success', function(event) {
      console.log('Text copied to clipboard successfully!');
    });

    copyBtn.addEventListener('click', function() {
      zeroClipboard.requestClipboardData(function() {
        zeroClipboard.showText('Text copied!');
      });
    });
  </script>
</body>
</html>
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!

All versions