SweetAlert, alertas personalizadas con interfaz profesional

DESCARGA : SeetAlert

SweetAlert, alertas personalizadas con interfaz profesional, una buena opción si aún no usas algún modal de jquery, bootstrap u otro framework. SweetAlert tiene diferentes presentaciones, la compatibilidad que tiene es la de adaptarse a cualquier equipo sin importar si es un dispositivo móvil, escritorio, este plugin tiene varias opciones como:

 

 

1.- Podemos encontrar mensaje básico (mensaje de texto y título).

2.- Mensajecon tiempo de cerrado.

3.- Mensaje de peligro y con una función agregada a un evento.

4.- También podemos encontrar un mensaje donde se le puede agregar  parámetros y se puede ejecutar con un botón la cancelación, esto es para mantener parámetros.

5.- Por último también podemos encontrarnos un mensaje con un icono.

La manera de instalarse es muy sencilla, vamos a tener que agregar las siguientes lineas de código:


<script src="lib/sweet-alert.min.js"></script>

<link rel="stylesheet" type="text/css" href="lib/sweet-alert.css">

 

Posteriormente vamos a implementar el siguiente script y configurar los parámetros correspondientes:

swal({   title: "Error!",text: "Heres my error message!",   type: "error",confirmButtonText: "Cool"});

Demostración: http://tristanedwards.me/sweetalert

Title null (required) El título.
text null Descripción de la notificación.
type null Tipo: “warning“, “error“, “success” e”info”.
allowOutsideClick false Si hay un evento para cerrar.
showCancelButton false Si hay un evento para cancelar.
confirmButtonText “OK” Botón de confirmación
confirmButtonColor “#AEDEF4” Color del botón de confirmación
cancelButtonText “Cancel” Texto del botón de cancelar
closeOnConfirm true Texto del botón de confirmar
imageUrl null Url de la imagen para mostrar en el modal.
imageSize “80×80” Tamaño de la imagen.
timer null Timepo de cerrado del modal en millisegundos.

You may also like...