mBox 0.2.6
mBox is a powerful library, helping you to easily create tooltips, modal windows, notice messages and more.
Demo: http://htmltweaks.com/mBox
Docs: http://htmltweaks.com/mBox/Documentation
Details
- Author
- Stephan Wagner
- Current version
- 0.2.6
- GitHub
- StephanWagner/mBox
- Downloads
- 3257
- Category
- Interface
- Tags
- Report
- GitHub Issues
Releases
Dependencies
-
_self_/_current_:
- core/1.4.5: '*'
- more/Element.Measure
- mBox
- mBox.Modal
How to use
A very basic mBox could look like this:
var myMBox = new mBox({
content: 'This is a very basic mBox. Click anywhere to close.'
});
myMBox.open();
The option attach helps you adding the open and close-events to your elements. In following example, the element with id myMBox will open and close your mBox:
new mBox({
content: 'This mBox will open when clicking on an element with id="myBox".',
attach: 'myMBox'
});
To attach a tooltip to an element use mBox.Tooltip:
new mBox.Tooltip({
content: 'Default tooltip.',
attach: 'myTooltip1'
});
If you want your tooltips to open with mouseclick instead, set the option event back to click:
new mBox.Tooltip({
content: 'This tooltip opens on mouseclick.',
attach: 'myTooltip2',
event: 'click'
});
To open a modal dialog use mBox.Modal:
new mBox.Modal({
title: 'My modal dialog',
content: 'This is a simple modal dialog window.',
attach: 'myModalDialog1'
});
Use mBox.Notice to show a notice to your visitors.
new mBox.Notice({
content: 'This is a default notice'
});
Those examples show only the very basic usage of mBox.
Read the Documentation at http://htmltweaks.com/mBox/Documentation to see the many options and events you can set to customize your mBoxes.
Discuss
A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.
Found a bug in this plugin? Please report it this repository's Github Issues.
blog comments powered by Disqus