Plugins

The plugins site is currently in development.

We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.

growl


jNotify Plug-in

The jQuery jNotify plug-in is an unobtrusive notification system for web-based applications. Use jNotify to inform users when specific actions have completed on your site–such as when an AJAX operation complete.

The jNotify plug-in is designed to replace code where you may have previously used the JavaScript alert() function to provide feedback to the user. The alert() function has two significant UI issues:

  • It is very obtrusive–users must take action (click "Ok") to remove the message or before you can interact with other elements on the page. While sometimes you want the user to acknowledge an action, often you just want to bring something to their attention without requiring them to take additional action.
  • You can not use rich-text–messages are limited to plain text only. Sometimes you want to provide rich-text features, such as links or images, in your notifications.

iGrowl, a simple jQuery plugin for iPhone notifications

This mimics the iPhones native Growl notifications. I first saw these in Tweetie (now Twitter for iPhone) when hitting the retweet button.

It has three options, to use simply include the jQuery Library and then any of these three things:

1. AJAX Spinner
$.iGrowl(1,"Please wait..."); //1 = ajax spinner

2. Success!
$.iGrowl(2,"Success!"); //2 = the tick icon

3. Error
$.iGrowl(3,"Error"); //3 = the cross icon

The idea is a simple notification system for iPhone and works perfectly for AJAX callbacks. You can customise the message to display anything you like and it works on all the modern browsers. It was intended for use only on Apples mobile devices but works and looks great in Firefox, Safari and Chrome and doesn’t look too bad in IE either.

jQuery UI Growl

jQuery UI - Mac OS - Growl plugin

A plugin for jQuery UI to show Mac OS type Growls (Notifications).

It simply shows a jQuery UI dialog in the bottom right corner and dissapears with a custom effect. Every seperate growl piles on top of others. Scrolling the page scrolls the growls along as well.

To show a growl simply do:

$.WsGrowl.show({content: '<p>Growling away!</p>'});
// Or
$(selector).WsGrowl();

Multiple parameters can be passed as an object literal through the 1st functions' parameter, Follow the link to find out and see a demonstration

Notification: Although this is still (very) beta, it does what my client requested. I will be continueing development when I come around to it, altho i imagine this could be a descent base for you developers out there!

okNotify

Yes. Another Growl-like notification plugin. This one is A) lightweight
(5.4kb uncompressed, < 2.7kb minified ) and B) Flexible, but
opinionated (takes care of common use-cases out of the box).
Additionally, as stated above, this plugin allows you to create multiple,
simultaneous message queues in different areas of the screen.

Tested in all major browsers (Firefox 3/3.5, Opera 9, IE 6/7/8, Safari 4).

Usage

The plugin add two functions to the jQuery object. noticeAdd takes a string
or an options object (options detailed below and in the script). Without
arguments noticeRemove will remove all notices from the page. If given a
selector or jQuery object it will remove those object(s).

Pines Notify

Pines Notify is a Growl like notification plugin. The Pines Notify plugin was developed by Hunter Perrin as part of Pines.

Download Pines Notify

Features

* Timed hiding with visual effects.
* Sticky (no automatic hiding) notices.
* Optional hide button.
* Supports dynamically updating text, title, icon, type...
* Stacks allow notice sets to stack independently.
* Control stack direction and push to top or bottom.

* Supports HTML (including forms) in title and text.
* Variable opacity.
* Supports Pines icons/jQuery UI icons/any CSS based icons.
* Supports custom classes for individual notice styling.
* Standard and custom effects.
* Optional drop shadows.

* Callbacks for various events, which can cancel events.
* History viewer allows user to review previous notices.
* XHTML 1.0 Strict compliance.

notifier

notifier is a jquery extension for calling inline overlays

namespace

     $.notifier

usage

/*
requires
--------------------
ttl -> string
msg -> string

options
--------------------
skin -> string | array -> [rounded, red (add your own)]
duration -> number millisecond (1000 = 1 sec)
*/
$.notifier.broadcast({ttl:'hello', msg:'this is a message'})
$.notifier.broadcast({ttl:'hello', msg:'this is a message', skin:'rounded'})
$.notifier.broadcast({ttl:'hello', msg:'this is a message', skin:'rounded', duration:2500})

Grumble

Grumble is a jQuery plugin that recreates the Growl notification experience in a web app.

Grumble is good looking out of the box, but supports theming so you can tweak to your heart's content.

jQuery Notifications

A fixed positioning notifications plugin. This one will show various notification types one over another at the top covering the entire width of the page. Tested in IE, Firefox and Chrome.

Please go to plugin home pageinstead to get more details(as well see it in action) about this plugin, as I don't want to be updating 2 places every time I make some revisions to the plugin.

But you should be able to always download the latest revision on this site as well.

Thanks!!

achtung

Growl-like notifications plugin for jQuery. Does not require jQuery UI but can optionally use some of its features.

Quick example:

// Create a new notification (5 second timeout)
$.achtung({message: 'Hello!', timeout:5});

// Create a new sticky notification, save as foo
foo = $.achtung({message: 'This will stay on-screen.', timeout: 0});

// Update with new message
foo.achtung('update', {message: 'Updated message!'});

// Close foo
foo.achtung('close');

// Remove all notifications
$('.achtung').achtung('close');

Growl for the net & jQuery

Growl (for the net & jQuery). A simple notification system inspired by growl for the mac os (http://growl.info).