Ir a contenido
Está usando una versión antigua de su navegador. Este sitio web no está preparado para su visualización en navegadores obsoletos.
Por favor, por su seguridad, instale un navegador más actualizado y seguro.

Navegador Internet Explorer 8  Navegador Google Chrome  Navegador Mozilla Firefox
 

blog

01 sep

Notificaciones en el favicon

0 comentarios how-to , Programación , Javascript , Web

Muchas aplicaciones web usan el favicon para notificar eventos, como nuevos mensajes o nueva actividad. Uno de los ejemplos más claros es Gmail, aunque también otros como Facebook o Pinterest lo usan.

 

Hace poco encontré una clase Javascript que permite implementar esta funcionalidad en una web: Notificon. Con esta clase, el notificar al usuario, por ejemplo, que tiene un nuevo mensaje en nuestra aplicación web es coser y cantar.

Cuando lo probé, era bastante limitado, por lo que modifiqué el código para permitir usar algunas opciones más. Originalmente permitía configurar el color del texto y el color del borde del texto. Mis modificaciones permiten además definir el tamaño del texto, el grosor del borde y la posición.

 

El uso es muy sencillo, basta con llamar a Notificon() pasándole dos parámetros, el texto a insertar y un array de opciones. Se puede ver en funcionamiento, así como ver el código de la clase, en este ejemplo en vivo.

 

Si lo prefieres, puedes descargar el ejemplo completo.

 

Aviso: el ejemplo usa un PNG como icono. Es posible que este icono no se muestre correctamente en versiones anteriores de IE o de Chrome. Si quieres probarlo sin tener que usar un icono en formato .ico, usa la última versión de Firefox.



Comentarios


Aún no hay comentarios.

Añade un nuevo comentario







 Enviando, por favor, espera...
Debes rellenar todos los campos.

Nunca haré público tu email, sólo se requiere a efectos estadísticos.

Comentarios malsonantes, con insultos, racistas, homófobos o con malas intenciones serán eliminados.

¡Muchas gracias por participar!


Ver blog

Creative Commons License Esta web http://alvaroremesal.net , su contenido, texto e imágenes está licenciado bajo una Licencia Creative Commons Reconocimiento-Compartir bajo la misma licencia 3.0 España.

2017 - Álvaro Remesal Royo   Avisos legales

logo-acms