Minimal Notification Plugin with Sound Effects - notify
| File Size: | 24.7 KB |
|---|---|
| Views Total: | 3992 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Notify is a minimalist jQuery plugin helps you create various types of notification messages while playing a sound effect you specify.
How to use it:
1. Place the required stylesheet in the head section of the document.
<link href="css/jquery.notify.css" rel="stylesheet">
2. Create custom messages and specify the notification types using data-notify-type attribute.
<p class="notify" data-notify-type="error">Error!</p> <p class="notify" data-notify-type="notice">Notice!</p> <p class="notify" data-notify-type="warning">Warning!</p> <p class="notify" data-notify-type="success">Success!</p>
3. Place jQuery JavaScript library and the jQuery notify.js plugin at the bottom of the webpage.
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="jquery.notify.js"></script>
4. Shows the notification messages on your screen.
$('.notify').notify();
5. Replace the sound effect.
$.notifySetup({sound: 'audio/notify.wav'});
6. More configuration options.
$('.notify').notify({
inEffect: {
opacity: 'show'
},
inEffectDuration: 100,
stay: 5000,
sticky: false,
type: 'notice',
position: 'top-right',
});
This awesome jQuery plugin is developed by yefei. For more Advanced Usages, please check the demo page or visit the official website.











