jQuery dialog box slide down to centre and not modal

I have a page in my website that when a user comes into it based on some condition, I would like through the use of jQuery, slide down a dialog box from the top centre of the screen to the centre of the page but still allowing the user to scroll the underlying page up and down but needs to ackno开发者_C百科wledge the dialog box to close page down or click on the underlying window's "X" (top right hand corner), to close window.

Please note that I would like to keep the dialog box centred at all times while the user scrolls up and down (i.e. not modal).

I am using Windows XP and MS IE8.

Try jQuery UI's dialog.

EDIT: Not sure if this is the best way to do it but this is how I did it:

$("<div />", { html:"Test." }).dialog({ autoOpen: true, position: "top" }).dialog( "widget" ).css({"position":"fixed","top":"0"}).animate({ top: "40%" }, 1000);

Elaborating on the other answer, you will want to add some class to dialogClass to jQueryUI's Dialog so that it will centered on the page at all time. (e.g. position: fixed)

http://jsfiddle.net/BWqWT/