I'm using SweetAlert2 v8 with animate.css to change the popup animation. The animation I am using is fadeInRight. I'm also using chained alerts and would like to change the closing animation to fadeOutLeft to have the effect of it sliding across the page.
The way I am adding the animate.css class is using the customClass popup property.
I've tried:
Neither method seems to work. Would be grateful if anyone knows how to change the closing animation.
Thank you
swal({
title: 'swal title',
html: 'some content',
showLoaderOnConfirm: true,
animation: false,
customClass: "animated fadeInLeft",
onClose: function(){
return delaySwalWithAnimation("fadeInLeft","fadeOutRight");
},
preConfirm: function(){
return delaySwalWithAnimation("fadeInLeft","fadeOutRight");
}
}).then(function(result) {
//...
}
function delaySwalWithAnimation(animationA, animationB){
return new Promise(function(resolve) {
$(".swal2-popup").removeClass(animationA);
$(".swal2-popup").addClass(animationB);
setTimeout(function() {
resolve();
},300);
});
}