simpleDialog.js

(function () {
  function addStyleText(text) {
    var head = document.getElementsByTagName('head')[0],
      style = document.createElement('style'),
      rules = document.createTextNode(text);

    style.type = 'text/css';
    if (style.styleSheet)
      style.styleSheet.cssText = rules.nodeValue;
    else
      style.appendChild(rules);
    head.appendChild(style);
  }

  addStyleText("\
  .gm-dialog {text-align:left;color:black; border-radius: 13px; box-shadow:-2px 2px 2px #C8C8C8; position:absolute; border:1px solid black; width: 600px;z-index:1000;background-color: white; font-size:13px; font-family: arial; padding: 15px 18px;}\
  .gm-dialog .gm-header {text-align:left;color:black; margin: -15px -18px 17px; padding: 12px 18px; background-color: #F3F3F3;border-top-left-radius:13px;border-top-right-radius:13px; font-weight:bold}\
  .gm-dialog .gm-header .gm-action { float:right;}\
  .gm-dialog a { color: blue; text-decoration:underline;}\
  .gm-dialog p { margin: 20px 0;}\
  .gm-dialog .gm-desc { margin-bottom:20px; color:blue; }\
  .gm-dialog .gm-footer { margin-top:10px; padding-top:10px; border-top: 1px solid #eee; text-align:center; }\
  .gm-dialog .gm-footer a { font-size:15px; font-weight:bold;}\
  ");
  $.fn.simpleDialog = function (title, cls) { //title is optional, cls is optional
    cls = cls || "";
    title = title || "Hey!";
    var $win = $(window);
    var x = $win.width() / 2;
    var y = $win.scrollTop() - 50;
    var $dialog = $("<div class='gm-dialog " + cls + "'><div class='gm-header'>" + title + "<span class='gm-action'><a href='#' class='gm-close'>Close</a></span></div></div>");

    $dialog.find("a.gm-close").click(function () {
      $dialog.remove();
      return false;
    });
    $dialog.append(this);
    
    $(this).data("simpleDialog", $dialog);

    $('body').append($dialog);
    $dialog.css({
      'top': Math.max(y - 100, 100),
      'left': Math.max(x - ($dialog.width() / 2), 50)
    });
    return this;
  }
})()

http://jsfiddle.net/Bxk2p/