FreenbarJS

A super awesome, minimalistic, responsive jQuery notification bar

The other day, I was searching for an easy to implement, (preferably minimalistic) jQuery notification bar but suddenly I was very dissappointed with what's out there, because other alternatives are very bloated and also cost money! haha, so I coded mine and set it free into the wild... (JK, just free as in #Opensource hehe).

Integration is dead simple:

The HTML5-shim & freenbar.js stylesheet (these go in the "head" section of your site):

  <!--[if lt IE 9]>     <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>   <![endif]-->      <link rel="stylesheet" href="css/freenbar.min.css"> 

These other lines go before closing the "body" section of your webpage:

  <!-- These 2 things are required in order to freenbar to work -->   <script src="https://code.jquery.com/jquery-latest.min.js"></script>   <script defer src="js/freenbar.min.js"></script>   <!-- End of the 2 things --> 

They're: jQuery and the script for the bar.

The HTML markup goes as follows:

<!-- Freenbar's code starts here --> <div id="barwrap">   <div class="bar">   <span id="head-image"><img src="img/authkey.png" alt=""></span>   <span id="text">The key of success is being passionate about what you do and never give up, no matter the circunstances ツ</span>   <span id="otherimg"></span>   <span id="ok"><a href="#">✔</a></span>   </div> </div> <!-- and ends here --> 

And that's pretty much it. If you explore the code you'll see is very simple and clear, so you will not have problems adapting it to your needs. No frameworks or extra plugins (besides jQuery) were used in the creation of this bar, so it's very lightweight too, download the ZIP file and enjoy!

Demo: http://xenodesystems.appspot.com/freenbar.html

Created by: @Jmlevick
License: Coffeeware