In diesem Beispiel wird ein einfacher Cookie-Banner am unteren Rand der Seite angezeigt. Wenn der Benutzer auf den "Ich stimme zu" Button klickt, wird die Zustimmung im localStorage des Browsers gespeichert, und der Banner wird ausgeblendet.
<!DOCTYPE html>
<html>
<head>
<title>Cookie Banner Beispiel</title>
<style>
/* Stil für den Cookie-Banner */
#cookie-banner {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #f0f0f0;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<!-- Cookie-Banner -->
<div id="cookie-banner">
Diese Website verwendet Cookies, um Ihre Erfahrung zu verbessern.
<a href="/datenschutz">Mehr erfahren</a>
<button id="cookie-consent">Ich stimme zu</button>
</div>
<script>
// JavaScript für den Cookie-Banner
const cookieBanner = document.getElementById('cookie-banner');
const cookieConsentButton = document.getElementById('cookie-consent');
// Überprüfen, ob der Benutzer bereits zugestimmt hat
const hasConsented = localStorage.getItem('cookieConsent');
if (!hasConsented) {
cookieBanner.style.display = 'block';
}
// Zustimmungsfunktion
cookieConsentButton.addEventListener('click', () => {
localStorage.setItem('cookieConsent', 'true');
cookieBanner.style.display = 'none';
});
</script>
</body>
</html>
