Search code examples
jquerycssmodal-dialogpopup

How to Create a jQuery New Message Popup Dialog

I am trying to create a jQuery powered popup block which users can compose a new message. I can most likely figure out the HTML/CSS to design and scale it... but does anybody have a solution for actually creating the popup?

Below is a Dribbble shot which is very close to what I'm trying to create:

Dribbble Shot

Solution

  • Have a look at jQuery UI's Dialog widget. Here's a link to an example with a form in the dialog.

    With that, you simply create your content in a div, give that div and id, and use $("#divId").dialog();

    The dialog function takes a large number of properties that you can use to control it's behaviour, such as autoOpen, to control whether the dialog opens automatically on page load, width and height.