Responsive Top/Bottom Notification Plugin With jQuery - NTF

Responsive Top/Bottom Notification Plugin With jQuery - NTF
File Size: 7.72 KB
Views Total: 660
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

NTF is a lightweight jQuery plugin that helps you create responsive, sliding, top or bottom notification bars with variable colors, widths and duration.

How to use it:

1. Load the core CSS file ntf.css in the header to style your notification bars.

<link href="css/ntf.css" rel="stylesheet">

2. Load jQuery library and the JavaScript file ntf.js at the end of the document.

<script src="//code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="js/ntf.js"></script>

3. Create a default notification bar that will alwasy stay at the top of the window.

$.ntf ({ 
  text: 'Custom Message Here.' 
  permanent: true
});

4. Place the notification bar at the bottom of the window.

$.ntf ({ 
  position: 'bottom'
});

5. Create a notification bar that will auto dismiss after 6 seconds.

$.ntf ({ 
  duration: 6,
});

6. Set the width of the notification bar.

$.ntf ({ 
  width: 600
});

7. Specify the background color of the notification bar.

$.ntf ({ 
  width: 600,
  color: 'red'
});

8. All default customization options.

$.ntf ({ 
  color: 'blue',
  duration: 5,
  permanent: false,
  position: 'top',
  responsive: true,
  text: '',
  width: 600
});

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