Smooth Animated Popup Message Box Plugin - wHumanMsg
| File Size: | 58.9KB |
|---|---|
| Views Total: | 6350 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
wHumanMsg is a jQuery plugin for displaying humanized popup boxes with animation effects on your page to show the important messages, alerts, warnings, etc.
Basic Usage:
1. Include jQuery library and wHumanMsg.js on your page
<script type="text/javascript" src="./inc/jquery.1.8.2.min.js"></script> <script type="text/javascript" src="wHumanMsg.js"></script>
2. Include wHumanMsg CSS to style your plugin
<link rel="Stylesheet" type="text/css" href="wHumanMsg.css" />
3. Markup a popup window area and the add a button to toggle the Message Box
<div id="test"></div>
<input type="button" value="default" onclick="hm.wHumanMsg('YOUR CONTENT');">
4. Call the plugin
<script type="text/javascript">
var hm = $("body").wHumanMsg();
$.fn.wHumanMsg.defaultSettings.color = 'orange';
</script>
5. More Options
$('#ID').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
});
Change log:
v2.0.1 (2014-03-11)
- Fix for msg position to fixed from absolute.
This awesome jQuery plugin is developed by websanova. For more Advanced Usages, please check the demo page or visit the official website.











