Awesome
iGrowl
iGrowl is a lightweight jQuery plugin that generates growl-like notifications with an emphasis on icons. Alerts are fully responsive and CSS animations are used to provide optimal performance.The plugin also includes 4 optional icon packs.
For full documentation, see iGrowl.
Features
- Elegant, clean look
- Highly customizable:
- includes numerous options, styles and animations
- can change defaults
- includes animation callbacks
- CSS animations - smooth performance on all devices
- Responsive - media queries for alert size
- Icon packs included
Dependencies
iGrowl has 3 dependencies:
- jQuery
- animate.css
- Optional: one or more of the 4 icon packs included - each includes its respective css and font files
- Vicons by Victor Erixon
- Feather by Cole Bemis
- Steadysets by Tommy Sähl
- Linecons by Sergey Shmidt
- You can use your own icon font - see docs for more info
- Icons are completely optional; iGrowl functions perfectly fine without icons
All icon packs have been compiled using Icomoon app.
Installation
To install, grab the necessary iGrowl files from dist
.
<!-- dependencies: jQuery + animate.css -->
<link rel="stylesheet" href="stylesheets/animate.min.css">
<script src="javascript/jquery.min.js">
<!-- iGrowl CSS + JS -->
<link rel="stylesheet" href="stylesheets/igrowl.min.css">
<script src="javascript/igrowl.min.js">
<!-- at least one of the following icon stylesheets: -->
<link rel="stylesheet" href="stylesheets/font css/vicons.css">
<link rel="stylesheet" href="stylesheets/font css/feather.css">
<link rel="stylesheet" href="stylesheets/font css/steadysets.css">
<link rel="stylesheet" href="stylesheets/font css/linecons.css">
Also, include the respective font files (eg: igrowl-feather.eot
, igrowl-feather.svg
, igrowl-feather.ttc
, etc.).
Note: you may need to change the icon css paths to the font files depending on how your project is organized.
To install via Bower:
$ bower install igrowl
Usage
To generate an iGrowl alert, simply call it by:
$.iGrowl({
message: "Hello world!",
// other options
})
For a full list of properties and methods, demos and examples, see iGrowl official documentation.
Browser support
- Chrome & Firefox
- Safari 4+
- IE 10+ or 9+ if you don't require animations
Features to come
Features I plan on adding:
- max number of notifications
- queue system - eg: if max number of notifications are reached, new notifications are queued until the current disappear
If you have any suggestions or requests, open a ticket or feel free to send me an email.
License
iGrowl is licensed under the MIT license (http://opensource.org/licenses/MIT).
Contributing
If you find any bugs, have feature requests, or would like to contribute - either send me a pull request or open a ticket and I'll do my best to address it.
Contributors: