Stylish JavaScript Dialog (Alert, Confirm, Prompt) Boxes
Posted on January 13, 2009, under Flash, jQuery,
Bookmark it
The following list is useful if you need to replace the classical JavaScript message boxes (alert, confirm, prompt) with new and CSS customizable ones. JQuery and MooTools are some of the libraries used to make these excellent dialog boxes.
jQuery Alert Dialogs Plugin is meant to replace the basic functionality provided by the standard JavaScript alert(), confirm() and prompt() functions. These custom methods are completely customizable via CSS, each dialog can have its own title, and also provide an advantage to the usage of prompt() in IE7, where users get an ugly warning and usually have to reload the page. This modal dialog box automatically positions itself if you resize the browser window. If the jQuery UI Draggable plugin is included, the box can be moved by dragging its title bar.
- Source: http://abeautifulsite.net/notebook/87
- Demo: http://abeautifulsite.net/notebook_files/87/demo/
- Download: http://www.bitrepository.com/download/jquery-alert-dialogs
- License: Dual-Licensed under the GNU GPL and MIT License
Sexy Alert Box is a “sexy” clone of the classic JavaScript alert. It is based on PBBAcpBox, a script that has been discontinued. However, it was released under a free license, and eventually adapted to version 1.2 of Mootools. This is an awesome script, because it shows the messages in a more beautiful design and works in modern browsers, such Internet Explorer.
Custom JavaScript Dialog Boxes is a lightweight JavaScript dialog box library that offers four dialog styles: alerts, warnings, prompts and success. The ‘look and feel’ can easily be changed through the CSS and additional styles can easily be added by adding 2 lines of CSS. It has an autohide feature which is used to fade out the dialog box after a specific number of seconds.
- Source: http://www.leigeber.com/2008/04/custom-javascript-dialog-boxes/
- Demo: http://sandbox.leigeber.com/dialog/dialog_box.html
- Download: http://www.bitrepository.com/download/custom-javascript-dialog-boxes
- Tested in: IE 6/7, Firefox 2/3, Opera and Safari
The JQuery UI Dialog Box is an awesome widget meant to work as an alternative for the classical JS dialog boxes. The design can be edited through CSS. Examples: modal dialog, message, confirmation, form. You can choose a design from 17 already created themes.
- Source: http://ui.jquery.com/home
- Demo: http://ui.jquery.com/demos/dialog/
- Tested in: IE 6.0+, FF 2+, Safari 3.1+, Opera 9.0+, and Google Chrome
JQuery Impromptu is a quick tool to prompt user input in a fashionable way. More or less it is a great replacement for an alert, prompt and confirm. It does not only replaces these, but it also allows for creating forms within these controls. The plugin is minified using JS Minifier.
- Source & Demos: http://trentrichardson.com/Impromptu/index.php
- License: MIT and GPL
Looking for something else?
Check the following premium web applications…
Lightbox Evolution for WordPressUploaded on August 18, 2010 by aeroalquimiaTotal Sales: 1357$18
|
Share the Love
|
Get Free Updates
|
- January 13, 2009
- article by Gabriel C.
- 3 comments
Related Posts
-
Apprise: The Attractive Alert Alternative for jQueryat April 24, 2011
-
Cute Confirmation Boxes: jConfirmAction jQuery Pluginat March 29, 2010
-
Slides: Customizable and Stylish Slideshow Plugin for jQueryat December 8, 2010
-
Free Stylish JQuery Image Slider Plugin: Nivo Sliderat March 24, 2010
-
Stylish your “Featured Items” using an interactive jQuery Widgetat January 1, 2010 with 1 comment







3 Replies to "Stylish JavaScript Dialog (Alert, Confirm, Prompt) Boxes"
March 27, 2011 at 4:54 AM
Hi. I am trying to use the “Stylish JavaScript Dialog (Alert, Confirm, Prompt) Boxes” but I can’t get it to work. The file example you provided does not contain a URL for the onclick botton event.
This is what I am trying: but the alert box appear and jumps to the uRL (google.com in this without case) confirming.
It only works without the url, as the sample provided.
Do you have a working sample that I can test. Thanks for your help.
March 28, 2011 at 8:58 AM
I still can’t get it to work. I need help with the structure of the button code. Here’s the button as I have it:
<input id="confirm_button" type="button" value="Show Confirm" a href="http://www.google.com" />
And I would also like it to work with a text link instead of a button:
Delete Me
Once again, thanks for your help.
March 28, 2011 at 7:45 PM
You didn’t specify what’s the script you are talking about. Anyway, you should just use the ID as a selector (it doesn’t matter whether it’s a button or a link).