Simple Sliding Notification Bar Plugin For jQuery - getNotified

File Size: 39.1 KB
Views Total: 4233
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Simple Sliding Notification Bar Plugin For jQuery - getNotified

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.