Please do not use jQuery in 2023
Repo is archived for history.
Try a modern implementations based on Web Components.
jQuery Notify bar
Please visit the project page for feedback and other details.
Simple plugin (basically it's not a plugin, but widget) to show notify bar (like on Twitter's webpage). It's very simple to use:
Installation
> bower install jqnotifybar
Usage
jQuery(function () {
jQuery.notifyBar({
html: "Thank you, your settings were updated!",
delay: 2000,
animationSpeed: "normal"
})
});
Usage position at bottom
jQuery(function () {
jQuery.notifyBar({
html: "Hi from below!",
cssClass: "Appear at bottom",
position: "bottom"
});
});
Options
Option | Description | Type | Default |
---|---|---|---|
html | What text will be inside bar. Can be HTML or just text. | String [optional] | "Your message here" |
delay | How long bar will be delayed, doesn't count animation time. | Integer [optional] | 2000 |
animationSpeed | How long this bar will be slided up and down. | String | Integer | "normal" |
jqObject | Custom jQuery object for notify bar. | jQuery object [optional] | null |
cssClass | You can define own CSS class for Notify bar. There are too premade classes "error", "warning" and "success". | String | "" |
close | If set to true close button will be displayed. | Boolean | false |
closeText | Sets the text to close button. | String | "Close [X]" |
closeOnClick | If enabled, user can hide notify bar just by click on it. | Boolean | true |
closeOnOver | If enabled, user can hide notify bar just by moving mouse cursor on it (suitable for really lazy people). | Boolean | false |
waitingForClose | If enabled, notify bar don't close until user presses the close button. | Boolean | true |
onBeforeShow | Callback on before show. | function | null |
onShow | Callback on show. | function | null |
onBeforeHide | Callback on before hide. | function | null |
onHide | Callback on hide. | function | null |
position | Set the position of notify bar. Possible values are top, bottom. | string | "top" |
Please visit the project page for feedback and other details.