Cookie-Bestätigung
Die Cookie-Bestätigung ist ein spezieller modaler Dialog. Sie wird am unteren Rand eingeblendet und kann nicht ohne Entscheidung geschlossen werden.
Voraussetzung
Ich gehe davon aus, dass du das HTML und das Javascript gemäss der Dialoge-Anleitung eingrichtet hast. Insbesondere die dialog.js übernimmt hier einen massgeblichen Anteil.
Dialog stylen
Die Cookie-Bestätigung wird über die CSS-Klasse cookie behandelt.
dialog.cookie {
margin: auto auto 0.8rem auto;
}
Alle weiteren Styles können vom Standard-Dialog geerbt werden.
Dialoginhalt erstellen
Das HTML für die Cookie-Bestätigung unterscheidet sich nur leicht vom Standard-Dialog.
<dialog class="cookie">
<header class="dialogHeader">
<p>Beispiel;</p>
<button class="icon" onclick="void(0);" title="Dialog kann nicht ohne Entscheidung geschlossen werden"></button>
</header>
<div class="dialogContent">
<p>Das ist ein Dialog.</p>
</div>
</dialog>
Dialog testen
Damit ist bereits alles Notwendige getan. Alles Weitere übernimmt die dialog.js. Wir können den Cookie-Dialog also gleich testen.
Cookies verwalten
Damit haben wir natürlich erst den Dialog zur Cookie-Verwaltung. Die Funktionalität dahinter muss nun ebenfalls sichergestellt werden.
Dran bleiben
Du hast es geschafft. Abonniere meine Benachrichtigungen, um weitere News und Anleitungen von mir zu erhalten.