set the dialog modal width for jquery ui?

From the docs:

  • http://docs.jquery.com/UI/Dialog

this should work:

$("#dialogStreetView").dialog( "option", "width", 460 );

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function() {
$("#myDialogBox" ).dialog({
  width: 500,
  autoOpen: false,
  show: {
    effect: "blind",
    duration: 1000
  },
  hide: {
    effect: "blind",
    duration: 1000
  }
}); 
$( "#myBoxOpener" ).click(function() {
  $( "#myDialogBox" ).dialog( "open" );
});
});
</script>

====== body ======

<div id="myDialogBox" title="My Dialog Box">
    <div id="myContentLayer">
    <p>My Content</p>
    </div>
</div>
<button id="myBoxOpener" class="myButton">Open Dialog Box</button>

jsFiddle Demo

Tags:

Jquery Ui