jQuery Humanized Message Plugin
JavaScript CSS
Switch branches/tags
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
demo
lib
src
.gitignore
README.md
gruntfile.js
index.html
package.json
wHumanMsg.jquery.json
wHumanMsg.min.css
wHumanMsg.min.js

README.md

wHumanMsg.js

A jQuery humanized message plugin is a way to neatly overlay alerts and message for users using your app. You can position your messages on any part of the screen and they will neatly fade in and out with any color and time delay you like.

Related Plugins

  • wTooltip - Simple sleek looking tooltips.
  • wModal - Clean looking and easy to use modals.

Settings

Available options with notes, the values here are the defaults.

$('#elem').wHumanMsg({
    theme           : 'black',      // set theme (color)
    opacity         : 0.8,          // set background opacity
    fadeIn          : 1000,         // set fade in speed in milliseconds
    fadeOut         : 1000,         // set fade out speed in milliseconds
    displayLength   : 5000,         // set length of time message will stay before fadeOut in milliseconds
    html            : true,         // set html flag to true/false
    fixed           : true,         // set fixed positioning to keep message at top of screen even when scrolling
    offsetTop       : 0,            // set offset from top
    showCloseButton : true          // toggle message close button
});

Examples

Include and init the plugin:

<script type="text/javascript" src="./wHumanMsg.js"></script>
<link rel="Stylesheet" type="text/css" href="./wHumanMsg.css" />
$("body").wHumanMsg();

messages

$("body").wHumanMsg('Hello World');

colors

$('body').wHumanMsg('Hello World!', {theme: 'red'});

Resources

License

MIT licensed

Copyright (C) 2011-2012 Websanova http://www.websanova.com