Hi all, I am new to JavaScript and JQuery UI. I am trying to figure how to set a specific position for the dialog box. I would prefer to be able to set it relative to the container "<div id="main">" that it is in; with a position of 10px from the top and 10px from the left.
According to the JQuery UI website you are supposed to be able to do it through an array "an array containing a coordinate pair (in pixel offset from top left of view port)." Unfortunately, I am not sure how to write the array. Could someone please help? Here is my code so far: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http:// www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml";> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Client-side Technologies</title> <script type="text/javascript" src="js/jquery-1.3.2.min.js"> </script> <script type="text/javascript" src="js/jquery- ui-1.7.custom.min.js"> </script> <link type="text/css" href="css/dot-luv/jquery- ui-1.7.custom.css" rel="stylesheet"/> <link type="text/css" rel="stylesheet" href="css/ research.css" /> <link type="text/css" rel="stylesheet" href="css/reset.css" /> <script type="text/javascript"> $(document).ready(function(){ $('#switcher').themeswitcher(); }); </script> <script type="text/javascript"> $.ui.dialog.defaults.bgiframe = true; $(function() { $("#child1").dialog({position: ['right','top']}); }); </script> </head> <body> <div id="main"> <div id="header"> <script type="text/javascript" src="http:// ui.jquery.com/themeroller/themeswitchertool/"> </script> <div id="switcher"> </div> </div> <div id="center"> <div id="parent" class="ui-dialog ui-widget ui-widget- content ui-corner-all undefined"> <div class="ui-dialog-titlebar ui-widget-header ui- corner-all ui-helper-clearfix"> <span id="ui-dialog-title-dialog" class="ui- dialog-title">Client-Side Technologies</span> </div> <div style="min-height: 109px; width: auto;" class="ui-dialog-content ui-widget-content" id="dialog"> <div id="child1" style=" min-height: 400px; width: auto;" title="JQuery vs Google DWT" > <p> test. </p> </div> </div> </div> </div> </div> <div id="footer"> </div> </div> </body> </html> --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
