JQuery

How to set width for jQuery UI dialog?

How to set width for jQuery UI dialog?, someone asked me to explain?
By:

We can set width to the jQuery dialog by using dialog method. The property supports number (pixels) and string, the only supported string is “auto”. In this below example I will show you how to set width for JQuery dialog.

We can set width by two types,

$("#myDialog").dialog("option", "width",600);

Or

$("#myDialog").dialog({

                width: 600

            });

Example:

<html>
<head>
    <title>how to applywidth for jquery dialog? </title>
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script type="text/javascript">
       $(document).ready(function ($) {
            $("#myDialog").dialog({
               width: 500
            });
        });
    </script>
</head>
<body>
    <h2 style="color: #841198">apply width for jquery dialog </h2>
    <div id="myDialog" title="Best WidgetLibrary">
        <p>
           jQuery UI, a trusted suite of official plugins for the jQuery JavaScript
library
        </p>
    </div>
</body>
</html>

Output:

apply width for jquery dialog

Related Article

Post your comments / questions



Recent Article