ClassyNotty
The notifications you will love!
Introduction
ClassyNotty is a jQuery plugin written by Marius Stanciu - Sergiu, a plugin that enables your application to display unobtrusive, beautiful and elegant notifications.
Download it
License
This jQuery plugin is distributed under the MIT license. Enjoy!Installation
First you need to include the jQuery library, since ClassyNotty is a plugin. You can download it from the jQuery website or link it directly from the Google CDN.
Secondly, you need to include the jQuery ClassyNotty javascript and the css file into your page. You can do it by adding the code below to your page.
Next, you implement the link/element that will trigger the notification. In a real application, you will trigger it by form submit, or ajax calls, etc. This is just an example.
Click here to notty up!
As the last step, you trigger the ClassyNotty() function on the element you just created. In this case, we trigger the function on the link with the id sample1.
$("#sample1").click({ $.ClassyNotty({ title : 'Title', content : 'This is a notification' }); });
Options
-
Parameters
- title - the title of the notification. Can be omitted.
- content - the content of the notification, HTML code included
- img - if the notification will display an image, it's the image location
- showTime - display time passed since the notification, can be true or false, default is true
- timeout - the timeout after which the notification will fade, default is 0, which means the notification will stay on the screen until closed manually
-
Callbacks
- click - the callback function called when the user clicks on the notification
Example
$.ClassyNotty({ content: 'Click on me to try the callback function', click: function() { $.ClassyNotty({ content: 'This notification was just created.', title: 'Callback!' }); } });
$.ClassyNotty({ title: 'Juno (spacecraft)', content: 'Juno is a NASA New Frontiers mission to the planet Jupiter.', img: 'images/demo/thumb.jpg', showTime: false });