Open JQuery UI Dialog box on Page Load

This is My Dialog box Description/Content

This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.



Sourcode

   
 
<html>
<head>

<!--Include Web Project Style File (If any)-->
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />

<!--Include JQuery Style File-->
<link href="~/Styles/css/sunny/jquery-ui-1.8.22.custom.css" rel="stylesheet" type="text/css" />

<!--Include JQuery File-->
<script type="text/javascript" language="Javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<!--Include JQuery UI File-->
<script type="text/javascript" language="Javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>

</head>
<body>

<div id="dialog" title="My Dialog Title">
    <p>This is My Dialog box Description/Content</p>    
	<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

<script type="text/javascript">
    $(function () {
        $("#dialog").dialog();
    });
</script>

</body>
</html>
Share with your friends!!