How to Create a Website Notification for Meassages?
SEO Help and Tips
How to Create a Website Notification for Meassages?
Here is the code of Notification toast for hidden Messages. Yoa can use it as Gadget.
<<head>> Section:
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<<body>> Section:
<div class="container mt-3">
<h3>Update Here</h3>
<p>You can add toast message Here</p>
<button type="button" class="btn btn-primary" id="toastbtn">Show Messages</button>
<div class="toast">
<div class="toast-header">
<strong class="me-auto">Toast Header</strong>
<button type="button" class="btn-close" data-bs-dismiss="toast"></button>
</div>
<div class="toast-body">
<p>Please Comments Below On Post</p>
</div>
</div>
</div>
<script>
document.getElementById("toastbtn").onclick = function() {
var toastElList = [].slice.call(document.querySelectorAll('.toast'))
var toastList = toastElList.map(function(toastEl) {
return new bootstrap.Toast(toastEl)
})
toastList.forEach(toast => toast.show())
}
</script>
Comments
Post a Comment
Thanks for your Comments.