Remplacer les boîtes d'alerte JavaScript par cette alternative réactive

Les pop-ups d'alerte JavaScript sont détestés par à peu près tout le monde. Ils forcent votre attention et dépassent le navigateur, vous devez donc les fermer avant de pouvoir interagir avec la page.

À l'ère moderne, nous pouvons faire mieux que les boîtes d'alerte JavaScript . SweetAlert2 est probablement la meilleure solution.

C'est un script pop-up alimenté par JavaScript qui est conçu pour être totalement réactif et supporter l'accessibilité pour tous les utilisateurs.

Naturellement, il est également ouvert et librement disponible sur GitHub si vous voulez creuser dans le code.

Mais, le vrai trésor est la démo sur la page web principale de SweetAlert. Il offre une comparaison directe entre la zone d'alerte JavaScript d'origine et le message SweetAlert2.

Ce qui est drôle, c'est que les extraits de code ne semblent pas vraiment changer les choses. Vous pouvez exécuter SweetAlert2 avec une ligne de code comme une alerte JavaScript typique, bien que cette ligne puisse être plus longue en comparaison.

Avec SweetAlert, vous avez plus de contrôle sur le style de la boîte contextuelle, l'animation, les couleurs des boutons et les styles de texte. Vous pouvez même intégrer des images ou des vidéos dans la zone d'alerte.

Cependant, la meilleure caractéristique absolue est que SweetAlert2 ne dépasse pas l'ensemble du navigateur . Si vous lancez une fenêtre contextuelle SweetAlert2, elle ne s'affichera que sur cet onglet . Ainsi, même si l'utilisateur navigue sur un autre site, il ne sera pas redirigé de force vers votre onglet simplement parce qu'une alerte est apparue.

Ceci augmente finalement l'engagement de l'utilisateur parce que les gens ne sont pas éloignés en raison de pratiques UX louches.

Vous pouvez définir des minuteurs à fermeture automatique, confirmer / rejeter les boutons, et même personnaliser l'animation en utilisant des bibliothèques tierces telles que Animate.css.

S'il y a un script que vous devriez utiliser au lieu de l'alerte JavaScript typique, il doit s'agir de SweetAlert2. Ce logiciel est totalement gratuit, open-source, et offre un tas d'options personnalisées qui feront sourire chaque développeur web d'une oreille à l'autre.

Consultez le site Web principal pour en savoir plus et voir quelques exemples en direct . Vous pouvez également parcourir le rapport GitHub si vous souhaitez voir les fichiers et consulter les journaux de version.