Toast Kullanımı
Örnek
<!DOCTYPE html>
<
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/html.html to edit this template
>
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="bootstrap-5.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<button type="button" class="btn btn-primary" id="toastBtn">
Bildirimi Göster
</button>
<div class="toast-container position-fixed bottom-0 end-0 p-3 ">
<div id="liveToast" class="toast text-bg-primary" role="alert" aria-live="assertive" aria-atomic="true" data-bs-delay="500">
<div class="toast-header">
<strong class="me-auto">Sistem Mesajı</strong>
<small>Şimdi</small>
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<div class="toast-body">
İşlem başarıyla tamamlandı! ?
</div>
</div>
</div>
</body>
</html>
<script src="bootstrap-5.3.5-dist/js/bootstrap.bundle.min.js"></script>
<script>
/*const toastElement = document.getElementById('liveToast');
// Butona tıklandığında çalışacak fonksiyon
document.getElementById('toastBtn').addEventListener('click', () => {
// Bootstrap Toast objesini oluştur/yakala
const toast = new bootstrap.Toast(toastElement);
// Toast'u göster
toast.show();
});*/
//new bootstrap.Toast(document.getElementById('liveToast')).show();
</script>