jQuery cosyAlert Plugin Demos

Configuration

$.cosyAlert.configuration

Var	Value
`defaultType`	`string, default: 'alert'` The default type for alerts.
`useQueue`	`boolean, default: false` Enable/disable the queue

$.cosyAlert.configurationAlert

Var	Value
`container`	null
`vPos`	'top'
`hPos`	'center'
`autoHide`	true
`autoHideTime`	4000
`showTime`	400
`hideTime`	600
`onShowComplete`	null
`onHideComplete`	null

Examples

Default

cosyAlert('I\'m a default alert...');

Default error

cosyAlert('I\'m a default error alert', 'error');

Chained alerts using callback function

cosyAlert('If at first you don\'t succeed...', 'notice', function(){ cosyAlert('Try try try and try again ;-)', 'success'); });

Sticky

cosyAlert('<strong>Sticky</strong><br />I\'m not gonna hide myself, make me !', 'notice', { autoHide : false });

Slow show and hide

cosyAlert('<strong>Slow show and hide</strong><br />I\'m old, I don\'t move so fast...', 'notice', { showTime : 1000, hideTime : 1000 });

Special

cosyAlert('<strong>I\'m special ! :-D</strong><br />Hey look a me (you have to close me)', 'notice', { vPos : 'top', hPos : 'right', autoHide : false, showTime : 300, hideTime : 750 });

Totally specialized alert

var options = {
	container : 'place-for-mr-special',
	vPos : 'middle',
	hPos : 'center',
	autoHide : true,
	autoHideTime : 7000,
	showTime : 1000,
	hideTime : 1000,
	onShowComplete : function(){
		cosyAlert('Mr. Special is now shown', { autoHideTime : 2000 });
	},
	onHideComplete : function(){
		cosyAlert('Mr. Special is now hidden', { autoHideTime : 2000 });
	}
};
cosyAlert('<strong>Mr. Special</strong><br />I\'m feed so... <em>customized</em>', 'notice', options);

Options

Queue ()

Enable queue

$.cosyAlert.configuration.useQueue = true;

Disable queue

$.cosyAlert.configuration.useQueue = false;

Positions

top left

cosyAlert('top left', { vPos : 'top', hPos : 'left' });

top center

cosyAlert('top center', { vPos : 'top', hPos : 'center' });

top right

cosyAlert('top right', { vPos : 'top', hPos : 'right' });

middle left

cosyAlert('middle left', { vPos : 'middle', hPos : 'left' });

middle center

cosyAlert('middle center', { vPos : 'middle', hPos : 'center' });

middle right

cosyAlert('middle right', { vPos : 'middle', hPos : 'right' });

bottom left

cosyAlert('bottom left', { vPos : 'bottom', hPos : 'left' });

bottom center

cosyAlert('bottom center', { vPos : 'bottom', hPos : 'center' });

bottom right

cosyAlert('bottom right', { vPos : 'bottom', hPos : 'right' });

Show all

cosyAlert('top left', { vPos : 'top', hPos : 'left' });
cosyAlert('top center', { vPos : 'top', hPos : 'center' });
cosyAlert('top right', { vPos : 'top', hPos : 'right' });
cosyAlert('middle left', { vPos : 'middle', hPos : 'left' });
cosyAlert('middle center', { vPos : 'middle', hPos : 'center' });
cosyAlert('middle right', { vPos : 'middle', hPos : 'right' });
cosyAlert('bottom left', { vPos : 'bottom', hPos : 'left' });
cosyAlert('bottom center', { vPos : 'bottom', hPos : 'center' });
cosyAlert('bottom right', { vPos : 'bottom', hPos : 'right' });

Types

Alert

cosyAlert('<strong>Alert</strong><br />I\'m gonna tell you something...', 'alert');

Notice

cosyAlert('<strong>Notice</strong><br />Come closer, listen up...', 'notice');

Success

cosyAlert('<strong>Success</strong><br />You have done som successfull things...', 'success');

Error

cosyAlert('<strong>Error</strong><br />But you are prone to errors !', 'error');