Sweet Alert
A short communication sent from one person to another or the central theme or idea of a communication. For more details
A Basic Message
HTML Code
<div class="card">
<div class="card-body text-center">
<button id="sweetalert-basic" class="btn btn-primary ">Try Me</button>
</div>
</div>
Script
document.addEventListener('DOMContentLoaded', function () {
const basic = document.getElementById('sweetalert-basic')
if (basic) {
basic.addEventListener('click', function () {
Swal.fire({
title: 'Hello! This is a Basic Message.',
backdrop: `rgba(60,60,60,0.8)`,
})
});
}
});
Title with a Text
HTML Code
<div class="card">
<div class="card-body text-center">
<button id="sweetalert-title" class="btn btn-primary ">Try Me</button>
</div>
</div>
Script
const title = document.getElementById('sweetalert-title')
if (title) {
title.addEventListener('click', function () {
Swal.fire({
title: 'The Internet?',
text: 'That thing is still around? question',
backdrop: `rgba(60,60,60,0.8)`
})
});
}