📅  最后修改于: 2023-12-03 14:47:47.310000             🧑  作者: Mango
Sweet Alert is a beautiful and customizable replacement for JavaScript's native alert and confirm dialog boxes. With Sweet Alert CDN, you can easily add this library to your project without the need to download and host it yourself.
To start using Sweet Alert CDN, follow these simple steps:
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
Swal.fire({
icon: 'success',
title: 'Success!',
text: 'Your action was successful.',
});
Here are some examples to demonstrate the usage of Sweet Alert CDN:
Basic alert:
Swal.fire('Hello World!');
Confirmation dialog:
Swal.fire({
title: 'Are you sure?',
text: "You won't be able to revert this!",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Yes, delete it!'
}).then((result) => {
if (result.isConfirmed) {
Swal.fire(
'Deleted!',
'Your file has been deleted.',
'success'
)
}
})
Custom styles and animations:
Swal.fire({
title: 'Custom Alert',
text: 'This is a custom alert with custom styles and animations.',
icon: 'info',
customClass: {
container: 'my-swal-container',
popup: 'my-swal-popup',
title: 'my-swal-title',
content: 'my-swal-content',
confirmButton: 'my-swal-confirm-button',
},
showConfirmButton: true,
animation: true,
})
Sweet Alert CDN provides a convenient way to add beautiful and customizable alert and confirmation dialog boxes to your web applications. With its range of options and customization possibilities, you can enhance the user experience and make your alerts more visually appealing. Give it a try and make your applications stand out!