https://www.german-design-award.com/_assets/396a91bff0b3ddf7c5dbea…/JavaScript/copy-link.js?1790830240

1const copyButton = document.querySelector('[data-type="copy-link"]');
2copyButton.addEventListener('click', function () {
3    navigator.clipboard.writeText(window.location.href)
4        .then(() => {
5            showPopupMessage(copyButton, 'Kopiert!');
6        })
7        .catch(err => {
8            console.error('Fehler beim Kopieren des Links:', err);
9            showPopupMessage(copyButton, 'Fehler!');
10        });
11});
12
13function showPopupMessage(button, message) {
14    const messageElement = document.createElement('div');
15    messageElement.textContent = message;
16    messageElement.style.position = 'absolute';
17    messageElement.style.backgroundColor = '#000';
18    messageElement.style.color = '#fff';
19    messageElement.style.padding = '5px 10px';
20    messageElement.style.borderRadius = '5px';
21    messageElement.style.fontSize = '12px';
22    messageElement.style.top = `${button.offsetTop - 30}px`;
23    messageElement.style.left = `${button.offsetLeft + button.offsetWidth / 2 - 30}px`;
24    messageElement.style.zIndex = '1000';
25    messageElement.style.transition = 'opacity 0.5s';
26    messageElement.style.opacity = '1';
27
28    copyButton.appendChild(messageElement);
29
30    setTimeout(() => {
31        messageElement.style.opacity = '0';
32        setTimeout(() => {
33            messageElement.remove();
34        }, 500);
35    }, 2000);
36}