1)
Download the below JQuery files from JQuery.com and paste the below JQuery
files to JQScripts folder
jquery-ui-1.9.1.custom.min.js
jquery-latest.js
2)
Do the same for following file also
jquery-ui-1.9.1.custom.css
3)
Copy and paste the
“images” folder to Css
4)
Load the script and CSS
files, in which page you want to display JQuery Model pop up
<script src="JQScripts/jquery-latest.js"
type="text/javascript"></script>
<script type
="text/javascript"
src="JQScripts/jquery-ui-1.9.1.custom.min.js"></script>
<link
href="Css/jquery-ui-1.9.1.custom.css" rel="stylesheet"
type="text/css" />
5)
Add the following script in script tag of <head> section
$('#openDialog').dialog({
title:
"Rate plan - More info",
//show:
"blind",
hide:
"explode",
modal:
true,
width:
800,
height:
250,
top:
15
});
$('#openDialog').load(url, function ()
{
$(this).dialog('open');
});
6 )
Add the html code in
between <form> </form> tag or <body> </body> tag
<div id="openDialog"
style="top:15px !important;"></div>