Easy Customizable jQuery Notification Bar Plugin
Kunal February 10, 2023
peekABar is an extra lightweight jQuery notification plugin which helps you create sticky notification bars with lots of customization options.
peekABar implementation
Install and Download:
# NPM $ npm install jquery-peek-a-bar --save
Add references to jQuery library and the jQuery peekABar plugin's stylesheet and JS files in the html page
Display a default notification bar on your web page. Pass the customization options to the default bar.
var defaultBar = new $.peekABar(); defaultBar.show(); var defaultBar = new $.peekABar({ // custom html content html: 'Your Message Here', // for autohide option delay: 3000, // auto hide after a timeout autohide: false, // padding padding: '1em', // background color backgroundColor: 'rgb(195, 195, 195)', animation: { // slide or fade type: 'slide', // animation speed duration: 'slow' }, // additional CSS class cssClass: null, // CSS opacity opacity: '1', // top or bottom position: 'top', // Close the bar by clicking on it. closeOnClick: false }); // Callback functions var defaultBar = new $.peekABar({ // Called after the bar is shown. onShow: function() {}, // Called after the bar is hidden. onHide: function() {}, });
The method to hide the notification bar.
defaultbar.hide();
Next: Benchmark Email Marketing tool Pros & Cons
Supported Devices
Chrome, IE8+, FireFox, Opera, Safari
Tags
notification plugins, peek a bar js plugin, peek a bar jquery plugin, js notification plugins, jquery notification plugins, js plugins, javascript plugins, jquery plugins