Sweetalert2 cdn

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10/dist/sweetalert2.all.min.js"></script>

Swal fire types

swal({
  title: "Are you sure?",
  text: "Your will not be able to recover this imaginary file!",
  type: "danger",
  showCancelButton: true,
  confirmButtonClass: "btn-danger",
  confirmButtonText: "Yes, delete it!",
  closeOnConfirm: false
},
function(){
  swal("Deleted!", "Your imaginary file has been deleted.", "success");
});

Source: lipis.github.io

Sweet alert 2 do action on confirm

Swal.fire({  
  title: 'Do you want to save the changes?',  
  showDenyButton: true,  showCancelButton: true,  
  confirmButtonText: `Save`,  
  denyButtonText: `Don't save`,
}).then((result) => {  
	/* Read more about isConfirmed, isDenied below */  
    if (result.isConfirmed) {    
    	Swal.fire('Saved!', '', 'success')  
    } else if (result.isDenied) {    
    	Swal.fire('Changes are not saved', '', 'info')  
 	}
});

Source: sweetalert2.github.io

How to install sweetalert2 with CDN?

<head>
   <!-- limonte-sweetalert2 -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" integrity="sha512-c42qTSw/wPZ3/5LBzD+Bw5f7bSF2oxou6wEb+I/lqeaKV5FDIfMvvRp772y4jcJLKuGUOpbJMdg/BTl50fJYAw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.1.9/sweetalert2.min.css" integrity="sha512-cyIcYOviYhF0bHIhzXWJQ/7xnaBuIIOecYoPZBgJHQKFPo+TOBA+BY1EnTpmM8yKDU4ZdI3UGccNGCEUdfbBqw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
   <script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.1.9/sweetalert2.all.min.js" integrity="sha512-IZ95TbsPTDl3eT5GwqTJH/14xZ2feLEGJRbII6bRKtE/HC6x3N4cHye7yyikadgAsuiddCY2+6gMntpVHL1gHw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</head>

<!-- You have to put the sweetalert2 script inside the body tag  -->
<body>
  <script>
    Swal.fire({
      title: 'Press CTRL + P to Print !!!',
      showClass: {
        popup: 'animate__animated animate__fadeInDown'
      },
      hideClass: {
        popup: 'animate__animated animate__fadeOutUp'
      }
    })
  </script>
</body>

Similar codes

1 vote331 views1 answer
Middel click vuejs
Html
2 votes305 views2 answers
Html emojiis
Html
4 votes296 views3 answers
Favicon.ico 404
Html
11 votes406 views2 answers
Text -center bootstrap
Html
2 votes429 views2 answers
Fa fa reset
Html
0 vote290 views1 answer
Lit element double click
Html
0 vote319 views1 answer
How to change the color of text in marquee in html
Html
0 vote385 views1 answer
How to select value in ul li tag in html
Html
0 vote320 views1 answer
Wordpress icon font awesome
Html
0 vote347 views1 answer
Flexbox afbeeldingen
Html