Simple Sliding Notification Bar Plugin For jQuery - getNotified
| File Size: | 39.1 KB |
|---|---|
| Views Total: | 4250 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
getNotified is an easy-to-use jQuery plugin to create responsive notification bars that slides out from the top or bottom of your web page. The active notification bars will disappear automatically after a timeout, and you can also dismiss them manually by clicking on the 'close' button.
Basic Usage:
1. Include the getNotified.css file in the head section for basic styles.
<link rel="stylesheet" href="css/getNotified.css">
2. Include jQuery library and the getNotified.js script at the end of your web page.
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <script src="js/getNotified.js"></script>
3. Create a container for the notification bar.
<div class="getNotifiedBox"></div>
4. Create a button to trigger a notification bar.
<button class="notify">Click me</button>
5. Call the plugin on the trigger button and set the notification messages and other options.
$(document).ready(function () {
$(".notify").getNotified({
// Animation Speed (in MilliSeconds)
velocity: 500,
// Notification Position: "bottom" or "top"
position: "top",
// Notification Content: h1 Title
title: "Voilà!",
// Notification Content: h2 Title
subtitle: "GetNotified is making your website notifications awesome",
// Notification Type: "success" or "warning"
type: "success",
// Delay Before Closing the Box (in MilliSeconds)
delay: 3200
});
});
This awesome jQuery plugin is developed by AhmedAlShair. For more Advanced Usages, please check the demo page or visit the official website.











