How to change the background (HTML) when a SweetAlert2 is active

Viewed 21

I think this is a basic question for the SweetAlert2 active users, so, here we go:

I have a SweetAlert2 ultra basic like this:

The SA2

What I want to do is to change the background (of the HTML) when the SweetAlert2 is active, and when the SweetAlert2 is deactivated (clicking the 'OK' button) the backgruond returns to its original state:

enter image description here

It could be change the background with an image or color, but what I want to know is how to change it.

1 Answers

If you want to change body background then document.querySelector('body').classList.add(yourCustomColorClassName) after deactiv alert document.querySelector('body').classList.remove(yourCustomColorClassName) , if your want to change alert's ovarley's background then change (.swal2-container.swal2-backdrop-show, .swal2-container.swal2-noanimation) class in your css , it will back original background color after deactive alert.

Related