<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Popup Banner Reklamı</title>
<link rel="stylesheet" href="styless.css">
</head>
<body>
<div class="modal-overlay"></div>
<div class="modal">
<div class="modal-content">
<span class="close-btn">×</span>
<a href="gidilecekyer.com"><img src="https://cdn.r10.net/image.php?u=187936&avatartime=" alt=""></a>
</div>
</div>
<script>document.addEventListener("DOMContentLoaded", function() {
const modalOverlay = document.querySelector(".modal-overlay");
const modal = document.querySelector(".modal");
const closeButton = document.querySelector(".close-btn");
modalOverlay.style.display = "flex";
modal.style.display = "block";
closeButton.addEventListener("click", function() {
modalOverlay.style.display = "none";
modal.style.display = "none";
});
modalOverlay.addEventListener("click", function(event) {
if (event.target === modalOverlay) {
modalOverlay.style.display = "none";
modal.style.display = "none";
}
});
});
</script>
</body>
</html>.modal-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: none;
justify-content: center;
align-items: center;
}
.modal {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #fff;
padding: 20px;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
display: none;
}
.modal-content {
text-align: center;
}
.close-btn {
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
}