自定义jquery ui 中dialog的弹出位置

jquery ui的dialog默认弹出位置为页面的中部，如果页面特别长，则弹出框可能在第一屏中看不到，需要自定义弹出的位置：

jquery ui的dialog默认弹出位置为{ my: "center", at: "center", of: window }

具体参见dialog的api：http://api.jqueryui.com/dialog/#option-position

positionType: Object or String or Array

Multiple types supported:

• Object: Identifies the position of the dialog when opened. The of option defaults to the window, but you can specify another element to position against. You can refer to the jQuery UI Position utility for more details about the various options.
• String: A string representing the position within the viewport. Possible values: "center", "left", "right","top", "bottom".
• Array: An array containing an x, y coordinate pair in pixel offset from the top left corner of the viewport or the name of a possible string value.

Code examples:

Initialize the dialog with the position option specified:

可以通过自定义position来自定义弹出位置，position文档：

http://api.jqueryui.com/position/

• my (default: "center")
  Type: String
  Defines which position on the element being positioned to align with the target element: "horizontal vertical" alignment. A single value such as "right" will be normalized to "right center", "top"will be normalized to "center top" (following CSS convention). Acceptable horizontal values: "left", "center", "right". Acceptable vertical values: "top", "center", "bottom". Example: "left top" or "center center". Each dimension can also contain offsets, in pixels or percent, e.g., "right+10 top-25%". Percentage offsets are relative to the element being positioned.
• at (default: "center")
  Type: String
  Defines which position on the target element to align the positioned element against: "horizontal vertical" alignment. See the my option for full details on possible values. Percentage offsets are relative to the target element.
• of (default: null)
  Type: Selector or Element or jQuery or Event
  Which element to position against. If you provide a selector or jQuery object, the first matching element will be used. If you provide an event object, the pageX and pageY properties will be used. Example: "#top-menu"

我最终采取的方式为：

position: { my: "center", at: "left+800px top+500px ", of: window  } 

//结合jquery ui ，优化系统提示
$(function() {
 	$("<div id='dialog' title='系统提示'>").appendTo("body");
    $( "#dialog" ).dialog({
      autoOpen: false,
      modal: true,
      position: { my: "center", at: "left+800px top+500px ", of: window  } ,
      buttons: {
        "确定": function() {
        	$( this ).dialog( "close" );
        }
      }
    });
    
});
function showMessage(message)
{
	$( "#dialog" ).html("<p>"+message+"</p>");
	$( "#dialog" ).dialog("open");
}