Download

Download showMessage 1.1

Install

You can install showMessage jQuery Plugin by including the script somewhere in the page AFTER jQuery. This plugin should work on jQuery version 1.3.2+.

<script type="text/javascript" src="/path/to/jquery.showMessage.min.js"
charset="utf-8"><\/script>

If you wish to style the text, the message is displayed through an unordered list in the div with id attribute=showMessage

#showMessage li
{
font-family: Arial, Helvetica, clean, sans-serif;
font-size: large;
font-weight: bold;
color: red;
}

Options

Here are the possible options with their default values:

thisMessage:		[''],
backgroundColor:	'#F7F7F7',
color:			'#000000',
opacity:		90,
displayNavigation:	true,
autoClose:		false,
delayTime:		5000

thisMessage (required)[Array]

The message you will be returning to the page. The message is in the form of an array.

blackgroundColor[string]

Default set to ‘#F7F7F7′. The background color of the message holder. (‘#F7F7F7′ or ‘rgb(247, 247, 247)’ or ‘white’)

color[string]

Default set to ‘#000000′. The font color in the message holder. (‘#000000′ or ‘rgb(0, 0, 0)’ or ‘black’)

opacity[integer]

Default set to 90. Opacity of the message holder. Value is an integer between 1 and 100.

displayNavigation[boolean]

Default set to true. Will display the ‘esc’ and ‘close’ information in upper right.

autoClose[boolean]

Default is set to false. When set to true, it will close the message holder after specified delay time.

delayTime[integer]

Default is set to 5000. Amount of time in milli-seconds before the message holder will close/hide (autoClose must be set to true).

Example

Simple

Just return a simple message to message holder.

jQuery.showMessage({
'thisMessage':['<mg src="/images/accept.png" alt="accept"/>successful!']
});

Advanced

This should look a lot like Twitter.

var returnMessage = ['Account was created successfully!','Thank you.'];
jQuery.showMessage({
'thisMessage':		returnMessage,
'backgroundColor':	'#f7f7f7',
'color':		'black',
'opacity':		95,
'displayNavigation':	false,
'autoClose':		true,
'delayTime':		6000
});