Setting relative position to JQuery UI Dialog

Question

Following is my JS:

ShowHoverServerImageModalWindow: function () {
    $("#divSettings").dialog({
        width: 200,
        height: 200,
        modal: false,
        title: "Server Image",
        autoOpen: false,
        closeOnEscape: true,
        draggable: false,
        resizeable: false,
        /*position: "my position!!", */
        buttons: [
                    {
                        text: "Close",
                        click: function () { $(this).dialog("close"); }
                    },
                  ]

    });

    //Show the dialog
    $("#divSettings").dialog('open');
},

I want the modal to be opened where my curser is at How can i do that?

Answer 1

source: http://jqueryui.com/demos/dialog/ and http://docs.jquery.com/Tutorials:Mouse_Position

$("#divSettings").dialog({
  ...  //your previous code
  position: [e.pageX, e.pageY]
});

Easily found on google.

or just before you trigger the pop-up:

EDIT: now include the trigger.

$(document).click(function (e) {
  $("#divSettings").dialog('option', 'position', [e.pageX, e.pageY]);
  $("#divSettings").dialog('open');
});