$.feedbackBar( message, options [optional] );

About

$.feedbackBar is meant to provide unobtrusive feedback to the user via an absolutely positioned bar at the top of your page. The position is absolute to the page because it is meant to provide feedback that can either be automatically closed after a certain length of time or by a user action. It positioning is not meant to alter the existing page content but instead, overlay it.

Download

The source code is available on Google Code:

Full source & minified source

Demos

Parameter: message [required]

This string ("") is a message you want to appear in the feedback bar. It can contain HTML.

Parameter: options [optional]

This optional object ({ }) contains key-value pairs that override the default settings:

wrapperClass (default: "feedback-bar")

The wrapper class applied to the feedback bar outer <div>. This can be customized with CSS.

innerClass (default "feedback-bar-content")

The class for the inner <div> which contains the actual message content. This can be customized with CSS. This is mainly provided so that the down and up animations of the bar are smooth if you apply padding around the message text.

durationIn (default: "slow")

A standard jQuery duration (string or number determining how long the animation will run) when the feedback bar slides into the page.

durationOut (default: "slow")

A standard jQuery duration (string or number determining how long the animation will run) when the feedback bar slides out of the page.

autoClose (default: false)

A standard jQuery duration (string or number determining how long the animation will run) until when the feedback bar should close itself. Set it to false to disable this.

manualCloseSelector (default: ".close")

Triggering a click on this jQuery-matched element will close the feedback bar.

delay (default: false)

A standard jQuery duration (string or number determining how long the animation will run) that determines how long to wait until the feedback bar comes into the page.

closeCallback (default: false)

A function that is executed after the feedback bar is closed.

Example usages:

Note: since only one feedback bar will appear on the page, you can call it statically without applying it to a jQuery selected object: $.feedbackBar(...);

Used on this page:


			var msg = "Welcome to the <code>$.feedbackBar</code> documentation.

			   <a class='close' href='#'>[X] Close</a>";

			$.feedbackBar(msg, { delay : 1000 });

$.feedbackBar("Welcome to the <code>$.feedbackBar</code> documentation.", {

			  delay : 1000,

			  autoClose : 5000

			});

$.feedbackBar("Welcome to my site!");


				$.feedbackBar(

				  "You're not logged in! You'll be redirected to the login page in 5 seconds.",

				  {

				    durationOut : 0,

				    autoClose : 5000,

				    closeCallback : function(){

				      window.location = "/login.aspx";

				    }

				  }

				);