Minimal Top Notification Bar Plugin For jQuery - Notifier

File Size: 5.21 KB
Views Total: 629
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Minimal Top Notification Bar Plugin For jQuery - Notifier

Notifier is a lightweight and easy-to-use jQuery plugin that helps create top sticky notifications with custom messages and call to action buttons on the webpage.

How to use it:

1. Load jQuery library and the jQuery Notifier plugin at the end of the document so the page loads faster.

<script src="//code.jquery.com/jquery-1.12.1.min.js"></script>
<script src="src/notifier.js"></script>

2. Create a default notification bar at the top of the document on page load.

$.notifier({
  "message":"My message here"
});

3. Create a custom notification bar at the top of the document when you click on a trigger element.

$('.trigger').click(function(){
  $.notifier({
    "message":"My message here",
    "closeButton":"text"
  });
});

4. Change the background & text color of the notification bar.

$('.trigger').click(function(){
  $.notifier({
    "message":"My message here",
    "closeButton":"text",
    "color1": "white", // background color
    "color2": "black", // text color
  });
});

5. Change the delay before the notification bar opens.

$('.trigger').click(function(){
  $.notifier({
    "message":"My message here",
    "closeButton":"text",
    "color1": "white", // background color
    "color2": "black", // text color
    "delay": "0",
  });
});

This awesome jQuery plugin is developed by ajarunthomas. For more Advanced Usages, please check the demo page or visit the official website.