How can I display a dialog in HTML using jQuery?

I wanted to display a popup dialog in my website.

And I wanted to know what alternatives do I have to do this?

I know the basics that the dialog should be a div that have a fixed or absolute position and that initially is hidden and then its style is changed to block from none, and maybe the top property and left is changed using jQuery to reflect the dynamic size of the div.

So the question is should I be coding Javascript by hand or I should use some library like jQuery.ui to do th开发者_如何学编程is? The problem is that jQuery.ui is 200KB and this is too much solely for displaying a dialog.

What alternatives are there besides jQuery.ui?

It sounds like you're still open to using jQuery UI.

Use jQuery UI.

If you create a custom build from jqueryui.com, the actual js file is 29kb minified, not the 200kbish that you feared. .dialog() sounds like it fits your needs perfectly, and 29kb should be manageable, so save yourself from writing the code :)

Edit: As suggested, AppRise comes in at 5kb, which is a great deal less and similar functionality. However, jQuery UI has a few more options that come with the size overhead.

If it was something pretty simple, AppRise might be a good alternative.

From their website:

Apprise is, more or less, for the developer who wants an attractive alert or dialog box without having to download a massive UI framework.

after a lot of searching i found this page which contains a lot of dialogs in jquery. http://choosedaily.com/1178/15-jquery-popup-modal-dialog-plugins-tutorials/

i now really consider jquery ui too bloated for me and so i will investigate to use one the options in the page above.

i think some which look good initialy are .

jqModal
http://dev.iceburg.net/jquery/jqModal/#examples

SimpleModal
http://www.ericmmartin.com/projects/simplemodal-demos/

and the 2 links below explain how to do that yourself without any plugin :)

Inline Modal Window w/ CSS and jQuery
http://www.sohtanaka.com/web-design/inline-modal-window-w-css-and-jquery/

How to create a stunning and smooth popup using jQuery
http://yensdesign.com/2008/09/how-to-create-a-stunning-and-smooth-popup-using-jquery/

i hope this was usefull