<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bootstrap Popup Örneği</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
<style>
/* Popup boyutu ve pozisyonu */
.popup {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 300px;
padding: 20px;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 4px;
z-index: 9999;
}
</style>
<script>
$(document).ready(function() {
// Sayfa yüklendikten 5-10 saniye sonra popup'u göster
setTimeout(function() {
$('.popup').fadeIn();
}, Math.floor(Math.random() * 5000) + 5000); // 5-10 saniye arası rastgele bir süre seç
});
</script>
</head>
<body>
<h1>Web Sitesi</h1>
<!-- Popup içeriği -->
<div class="popup">
<h2>Hoş Geldiniz!</h2>
<p>Bu bir örnek popup'tır.</p>
<button class="btn btn-primary" onclick="$('.popup').fadeOut();">Kapat</button>
</div>
</body>
</html>