Prøv med den her:
<!DOCTYPE html>
<html lang="da">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aldersbegrænsning</title>
<style>
/* Stil til pop-up boksen */
#ageModal {
display: block; /* Start med at vise boksen */
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5); /* Mørk baggrund */
}
#ageModalContent {
position: relative;
background-color: white;
margin: 15% auto;
padding: 20px;
width: 300px;
text-align: center;
border-radius: 10px;
}
.btn {
margin: 10px;
padding: 10px 20px;
cursor: pointer;
background-color: #008CBA;
color: white;
border: none;
border-radius: 5px;
}
.btn:hover {
background-color: #005f6b;
}
</style>
</head>
<body>
<div id="ageModal">
<div id="ageModalContent">
<p>Er du over 18 år?</p>
<p>For fuld adgang til hjemmesiden skal du være min. 18 år</p>
<button class="btn" onclick="acceptAge()">Ja</button>
<button class="btn" onclick="denyAge()">Nej</button>
</div>
</div>
<script>
function acceptAge() {
// Giver adgang ved at fjerne pop-up boksen
document.getElementById('ageModal').style.display = 'none';
}
function denyAge() {
// Sender brugeren til en anden side (f.eks. Google) hvis de er under 18
window.location.href = "
https://www.google.com"; }
</script>
</body>
</html>