March 20, 2012
Positioning a jQuery UI dialog offset from the Center
Question by Hawkee
I’d like to position my jQuery UI dialogs a bit better. The default “center” position puts them directly in the middle of the page, but it certainly looks better to have them offset about 70% up the page as they are in Facebook. I’m looking at the .position function but am a bit unclear what the simplest solution is.
Answer by Starx
The easiest way would be to use the position()
$("#dialog").dialog("widget").position({
my: 'left',
at: 'right',
of: target
});
Or, if you already have calculated the dimensions
var x = 50; //calculate the 70%, with your own logic
var y = 100;
$("#dialog").dialog('option', 'position', [x,y]);
Or you can specify the height during initialisation of the widget
$("#dialgo").dialog({
autoOpen: false,
width: 400 ,
position: [300,200]
});