c# .net Adsense ADO.NET Linq Viruses/security asp.net MVC JQuery Angular-js Node-js SEO Java C++ SQL API Networking vb.net .Net Css JavaScript Generics c#.Net entity framework HTML Website host Website Construction Guide HTTP tutorial W3C tutorial Web Services JSON Psychology Ionic framework Angular ReactJS Python Computer Android
JQuery

How to set width for jQuery UI dialog?

| | JQuery

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: