Notificaciones estilo Growl con Jquery

Growl en Mac

Growl es un sistema de notificaciones usado en Mac OS X, que es bastante elegante y permite que todas las aplicaciones permitan dar el mismo tipo de notificaciones. En la imagen puedes ver su apariencia:

Lo cierto es que es una de tantas posibilidades para notificar algo en un sistema operativo. La cuestión es que dados los avances en desarrollo web de los últimos años se puede trasladar este tipo de apariencia y funcionalidad a la web de manera similar.

jGrowl (Growl con jQuery)

El proyecto se llama jGrowl y la descarga es gratuita (al final del post tienes los enlaces). Lo cierto es que una vez que incluyas los archivos javascript y css en el html, su uso es muy sencillo:

// Hola Mundo simple
$.jGrowl("Hello world!");
 
// Se queda en la esquina sin quitarse
$.jGrowl("Stick this!", { sticky: true });
 
// Mensaje con un header en el mismo rectángulo
$.jGrowl("A message with a header", { header: 'Important' });
 
// Estableciendo el tiempo que se muestra antes de ocultarse
$.jGrowl("A message that will live a little longer.", { life: 10000 });
 
// También puedes controlar cuando se va a abrir para hacer algo
$.jGrowl("A message with a beforeOpen callback and a different opening animation.", {
    beforeClose: function(e,m) {
        alert('About to close this notification!');
    },
    animateOpen: {
        height: 'show'
    }
});