Lightweight Prototype-based floating/resizable popup window

Question

What's the best way to implement Meebo-style floating windows? I'd prefer to use Prototype (but if there's a good Jquery implementation I'd be happy to look into it as well). I'd like windows to be draggable/resizable and generally "lightweight" and responsive.

Answer 1

You might want to check out the dialog component in jQuery UI. It is part of the official UI Library provided by jQuery. Download the jQuery and jQuery UI and then make sure you have references to both scripts in your page. Then, it is as simple as calling dialog() on a jQuery object. Check out the dialog documentation for more information.

<script type="text/javascript">
$(function() {
   $("#dialog").dialog();
});
</script>

<div id="dialog" title="Basic dialog">
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>