Looking for particular alert box behavior

Question

I'm interested in alert boxes such as,

http://www.visual-blast.com/javascript/nice-alert-box-with-jquery-impromptu/

and

http://woork.blogspot.com/2008/08/design-stunning-alert-box-using.html

but with a different functionality, the user should be able to interact with the page even with the alert box present, so it needs to be movable and not obscure the underlying page, as in this example,

http://www.open-lab.com/mb.ideas/index.html

Alert box should be generated automatically on page view plus the title and message of the alert box should change with each page refresh from expandable library.

Is there anything out there like this?

Thanks

Answer 1

Here is an example with mootools. You easily can extend any element on the page to be draggable. You may use this plugin as a sample of alerts and you'll just need to remove some functionality and add make it draggable.

Answer 2

Sounds like the jQuery UI dialog widget might do what you need?

http://jqueryui.com/demos/dialog/

Answer 3

Thank you. This looks promising. I was given some earlier advice regarding auto populating the title/text:

A) you can have a JSON file or an XML file where you define title and contents for your container and a js function that once the page is loaded, get randomly the title and content and insert them in the right dom element. B) The content of the container is populated server side using php or jsp or aspx C) you have a js array that contains the value of the title and of the content you want to put in your container and than you have a function that populate your container. In all these cases you should initialize your container just after you populate them! otherwise doesn't work.

Any thoughts on this? I'm not close to being a programmer but can cobble together script with the best of them.

Answer 4

There are few custom dialogs in moo.rd. One of them is the Custom.Alert: http://www.moord.it/examples/custom_alert