TinyBox is a lightweight (3.5kb) modal window script that does not depend on any JavaScript frameworks.
It can display any Ajax or HTML content (from text to videos). Also, if enabled, the modal boxes fade in/out & dynamically resize based on the loaded content.
With the auto-hide support, the script can be used to show notifications. It is called & configured within one line, like:
TINY.box.show('advanced.html',1,300,150,1,3)
where all the settings can be mentioned easily. For a demo of TinyBox, click here.
Requirements: No Requirements
Compatibility: All Major Browsers
ModalBox is a JavaScript technique for creating Web 2.0 – style modal dialogs (or sequence of dialogs) without using standard popups and page reloads.
It’s inspired by Mac OS X modal dialogs and based on Prototype JavaScript framework + script.aculo.us and valid XHTML/CSS. Content can be loaded with Ajax or just plain-HTML.
ModalBox Features
- Web 2.0-ready. ModalBox uses industry-standard libraries — prototype and script.aculo.us.
- Offline-mode. Use dynamic- or plain-HTML without any Ajax-calls to fill out your dialog windows.
- AJAX page loading. ModalBox uses AJAX instead of deprecated
iframe for content loading. It’s also more secure — you can’t access pages that are not on your host.
- Callbacks support. You can attach your own JavaScript events after showing or hiding (and more) the ModalBox
- Automatic height adjustment. ModalBox adjust it’s height depending on your content. No more height tweaking!
- Scrolling mode. If your content is long, just define the height of the ModalBox and it will switch into “scrolling mode”
- Browser and platform independent. Since most modern browsers use popup blockers, it’s hard to find another way to create 100% browser-compatible modal dialogs.
- Multi-purpose. You can create complex wizards to guide users through the process. Image slideshows can be created too.
- Keystrokes support. Use ESC key to close ModalBox.
- Customizable Look & Feel. Use CSS to make ModalBox look like you want.
- Supports transitional effects. Slide down appearing and on-the-fly resizing.
- Lightweight. Just about 10 KB of code.
- Works in most modern browsers. Tested in IE6, IE7, Firefox 1.0, 1.5, 2.0, Safari, Camino, Opera 8 and 9.
P.S. There is a Mootools clone of ModalBox named MOOdalBox.
Requirements: Prototype + script.aculo.us (included)
Compatibility: All Major Browsers
