<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div> <div id="status" class="status">Durum kontrol ediliyor...</div> </div>

body { font-family: Arial, sans-serif; text-align: center; margin-top: 100px; } .status { font-size: 24px; padding: 20px; border-radius: 10px; display: inline-block; } .online { background-color: #dff0d8; color: #3c763d; } .offline { background-color: #f2dede; color: #a94442; }

$(document).ready(function(){ function updateStatus() { const el = document.getElementById('status'); if (navigator.onLine) { el.textContent = "✅ İnternete bağlısınız."; el.className = "status online"; } else { el.textContent = "❌ İnternet bağlantısı kesildi..."; el.className = "status offline"; } } // Durumu ilk başta kontrol et updateStatus(); // Bağlantı tekrar sağlanınca güncelle window.addEventListener('online', updateStatus); // Bağlantı kesilince sayfayı yenile window.addEventListener('offline', () => { updateStatus(); setTimeout(() => { // window.location.reload(); // true parametresi artık kullanılamıyor, etkisiz. }, 2000); // 2 saniye sonra yenile }); });