Una de las incomodidades de los programadores Web es cambiar ese alert(«»); de JavaScript que en muchas ocasiones mata todo el diseño y la elegancia de nuestra interfaces, es por ello que en este artículo veremos como poner en marcha notificaciones con Notify.js un plugin que sin duda le dará ese toque de profesionalismo sin echar por la borda nuestros diseños de manera sencilla y personalizable, con lo que lograríamos brindar a nuestros usuarios una mejor UX.
Primero que todo debemos bajarnos los archivos necesarios para poder usar Notify.js, necesitamos su librería y JQuery:
Luego creamos una carpeta en nuestro equipo (No necesariamente en la carpeta de nuestro servidor) y luego guardamos nuestros dos archivos, posterior a esto creamos un archivo HTML y lo llamaré index.html y lo ubicamos en el mismo directorio:
🌟 ¡Visita Nuestra Tienda para Programadores! 🌟Descubre Códigos Fuente, Cursos, Software, Computadoras, Accesorios y Regalos Exclusivos. ¡Todo lo que necesitas para llevar tu programación al siguiente nivel!
abrimos nuestro archivo index.html con el editor de código de nuestra preferencia, si aún no te decides por alguno puedes pasarte por este artículo y hacer tu elección.
Veamos como mostrar un mensaje al abrir la página:
[cc lang=»html»]
[/cc]
Copiando el contenido anterior en tu archivo index verás como al abrir tu página podrás ver saltar un mensaje estilo notificación.
Ahora bien podemos hacer que el mensaje se muestre cuando nosotros queramos ya sea al pulsar un botón o al terminar una acción, veamos los tipos de notificaciones que podemos usar, haciendo uso de un botón:
[cc lang=»html»]
[/cc]
Con este ejemplo podrás ver como lanzar los diferentes estilos de notificación:
Bueno amigos ese es el funcionamiento básico de este plugín, ahora solo es cuestión de adaptarlo a la lógica de sus aplicaciones, este plugin también posee otras funcionalidades que podrás encontrar en su documentación.
Hasta pronto!.