Handy Toast Like Alert Notification Plugin - jQuery Notify
File Size: | 16.6 KB |
---|---|
Views Total: | 542 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Notify is a small, handy jQuery notification plugin which helps you create Android toast-like alert and loading popups with custom icons on the web page.
How to use it:
1. Add the jQuery Notify plugin's files to the page, after you've added jQuery JavaScript library.
<script src="//code.jquery.com/jquery.min.js"></script> <link href="dist/notify/notify.min.css" rel="stylesheet"> <script src="dist/notify/notify.min.js"></script>
2. The JavaScript to create toast notifications. Possible parameters:
- notification: notification message
- timeout: timeout in milliseconds. -1 = always visible
- theme: "success", "information", "error", "attention"
- hasMaskLayer: whether to display the background overlay
- isLoading: shows loading animation
$.notify(notification, timeout, theme, hasMaskLayer, isLoading);
3. More examples.
// shows a default toast notification // auto closes after 3 seconds // with a background overlay // with a loading animation $.notify("default notify", 3000, "", true, true); // shows a SUCCESS toast notification // auto closes after 3 seconds // without background overlay // without loading animation $.notify("success notify", 3000, "success", false, false); // shows an ATTENTION toast notification // auto closes after 3 seconds // with a background overlay // without loading animation $.notify("attention notify", 3000, "attention", true, false); // shows an INFORMATION toast notification // auto closes after 3 seconds // without background overlay // with a loading animation $.notify("information notify", 3000, "information", false, true); // shows an ERROR toast notification // always visible // with a background overlay // without loading animation $.notify("error notify", 3000, "error", true, false);
This awesome jQuery plugin is developed by lisanmiao. For more Advanced Usages, please check the demo page or visit the official website.