Search code examples
javascriptperformancepopupwindowsweetalert

Sweet alert JS library - modify animation speed

I would like to make the animation speed for Sweet Alert popup a little slower. I tried to search in everywhere,documents,web,forums but with not so much success. How can I decrease the animation speed ?

Solution

  • The original sweet alert plugin is unsupported, I suggest you using SweetAlert2 plugin.

    Migration is simple, here's the migration guide: Migration from SweetAlert to SweetAlert2

    In SweetAlert2 you can change the animation speed by overriding the show and hide classes:

    Swal.fire({
  title: 'Custom animation speed',
  showClass: {
    popup: 'slow-animation-show'
  },
  hideClass: {
    popup: 'slow-animation-hide'
  }
})
    .slow-animation-show {
  animation: swal2-show 3s; 
}

.slow-animation-hide {
  animation: swal2-hide 3s; 
}
    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>