23rd & Walnut
Notificaion Menu
jQuery Plugin
Documentation and help file
Saleem El-Amin
7/27/2011
Contents
Quick Start: .................................................................................................................................................................2
Notification Bubbles ...................................................................................................................................................3
Overview .................................................................................................................................................................3
EXAMPLE .................................................................................................................................................................3
Notifications ...............................................................................................................................................................4
Callbacks and User defined Actions ...........................................................................................................................5
Dependencies .............................................................................................................................................................6
API ...............................................................................................................................................................................7
FAQs ............................................................................................................................................................................9
Related Premium File .............................................................................................................................................. 10
FREEBIES .................................................................................................................................................................. 11
Quick Start:
Make sure you have included the following in your page:
1. jQuery
2. jQuery UI
3. The Notification menu plugin
4. The Notification menu css file
var notifications = new $.ttwNotification0HQX();
//use the any of the API functions. See API section for more details
//Add bubbles to a menu
notifications.initMenu({
someCategory:'#menuItemSelector'
});
//create a notification
notifications.createNotification('Sample Notification');
//delete a notification
var notification = notifications.creatNotification('some notification');
notifications.deleteNotifiction(notification);
//get the notifications in a category
var notificationsInSomeCategory = getNotifications('someCategory', 'unread');
Notification Bubbles
OVERVIEW
You can add notification bubbles to any html element.
Each bubble is associated with one category.
Each category is associated with one menu item.
You do not need to add a bubble for every category.
You must initiate the bubbles before you start creating notifications
EXAMPLE
In the image above, there are three categories that have notification bubbles active. The bubbles above could be
created with the following code:
//Initiate the notification center
var notifications = new $.ttwNotificationCenter();
//Add bubbles to a menu
notifications.initMenu({
projects:'#projects', //create 'projects' category and tie to '#projects' html element
tasks:'#tasks',
messages:'#messages'
});
