• Home

Logo

Navigation
  • Home
  • Articles
    • Content Writing
    • Design
    • General
    • Internet Marketing
    • Social Media
    • Tools and Tips
    • Usability
    • Web Hosting Articles
  • Tutorials
    • AJAX Tutorials
    • ASP Tutorials
    • C# Tutorials
    • CGI and Perl Tutorials
    • CSS Tutorials
    • Flash Tutorials
    • HTML Tutorials
    • Illustrator Tutorials
    • Java Tutorials
    • JavaScript Tutorials
    • Linux Tutorials
    • Miscellaneous Tutorials
    • MySQL Tutorials
    • Photoshop Tutorials
    • PHP Tutorials
    • Python Tutorials
    • Wireless Tutorials
    • WordPress Tutorials
    • XML Tutorials
  • Scripts
    • AJAX Scripts
    • ASP Scripts
    • ASP.NET Scripts
    • CGI & Perl Scripts
    • Flash Scripts
    • Java Scripts
    • JavaScript Scripts
    • PHP Scripts
    • Python Scripts
    • Remotely Hosted
    • Tools and Utilities
    • XML Scripts
  • Answers
  • Online Services
  • Tools

jGrowl, an OS X Growl-like jQuery message plugin

By Akash Mehta | on Jul 8, 2008 | 0 Comment
JavaScript Tutorials
  • Tweet
  • Share
  • Tweet
  • Share

jGrowl is a plugin for the jQuery that generates unobtrusive notification boxes on a page. It has a similar design to the OS X Growl Framework, after which it is named. With jGrowl, web developers can easily display brief information messages and alerts to their users during busy sessions with complex web applications.

jGrowl integrates cleanly into jQuery, offering a simple API for displaying messages. By default, the message is displayed in an elegant black box for a few seconds, with a close button for the user to hide it manually. However, as expected of a jQuery API, the plugin also has a wealth of options to configure its behaviour, accepting parameters in JSON format.

Each message can be configured to be “stickied” – that is, to remain in place until dismissed by the user. New messages can also be added to the beginning of the stack, as opposed to the end, in a case where one or more jGrowl messages may already be visible. A number of options for configuring visual appearance are available, and jGrowl can use a specified CSS class as well, giving the developer full control over the final display. Message transitions are animated, and the animation effect can also be configured.

The API also features a number of powerful hooks, providing events on which user-defined functions can be fired – also passed in through the JSON configurations. For example, functions can be fired before and on opening and closing each message, as well as during the open animation and close animation.

Two versions are available, one recommended for jQuery 1.0.x, the other for jQuery 1.2.x, so jGrowl should be compatible with your existing jQuery-powered application. The standard download includes extensive samples, and it’s very easy to get started. Head over to the project page, or the jQuery plugin page for further details.

Share this story:
  • tweet

Author Description

No Responses to “jGrowl, an OS X Growl-like jQuery message plugin”

You must be logged in to post a comment.

Connect With Us

RSSSubscribe 1,240Followers 494Likes
  • Popular
  • Recent
  • Comments
  • Creating Energy Spheres in Photoshop

    Apr 15, 2008 - 96 Comments
  • Easy Screen Scraping in PHP with the Simple HTML DOM Library

    Aug 6, 2008 - 20 Comments
  • Calculating date difference more precisely in PHP

    Mar 7, 2008 - 13 Comments
  • When Does Hosting Your Website in the Cloud Make Sense?

    Oct 8, 2010 - 2 Comments
  • Fun with the Microsoft Managed Extensibility Framework Part 2

    Oct 6, 2010 - 0 Comment
  • Fun with the Microsoft Managed Extensibility Framework Part 1

    Sep 22, 2010 - 0 Comment
  • Website Management on the go with the iPad

    I appreciated your post, but I was looking for something I didn't...
    November 24, 2012 - drmoderator
  • Creating Energy Spheres in Photoshop

    I'm a little stuck down here especially at the step of creating the...
    November 23, 2012 - sarah
  • Running background processes in PHP

    Can you give an example? As see it, you can use this only when you...
    November 16, 2012 - Shaked Klein Orbach
Developer Resources
  • Tutorial Directory
  • Learn HTML
  • Learn PHP
  • Learn CSS
  • Learn AJAX
  • Learn JavaScript
  • Learn Pear
  • White Papers
  • Resources
    • NetVisits Web Directory
    • Realtor Pixels
    • Answers On The Run
    • Ask A Geek
  • Recent Posts

    • When Does Hosting Your Website in the Cloud Make Sense?
    • Fun with the Microsoft Managed Extensibility Framework Part 2
    • Fun with the Microsoft Managed Extensibility Framework Part 1
    • Website Management on the go with the iPad
    • Code Contracts in C# 4.0 – Part 1

    Calendar

    May 2013
    M T W T F S S
    « Oct    
     12345
    6789101112
    13141516171819
    20212223242526
    2728293031  

    Recent Comments

    • drmoderator on Website Management on the go with the iPad
    • sarah on Creating Energy Spheres in Photoshop
    • Shaked Klein Orbach on Running background processes in PHP
    • Thomas Cuvillier on How To Upload Files Using PHP
    • rizal aditya on Extracting text from Word Documents via PHP and COM
    • Home
    © 2003 - 2013 DeveloperTutorials.com. All Rights Reserved. Privacy Policy.