Copy Code code as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title> Frame Cover Effect </title>
<style type= "Text/css" >
#dialog_link {padding:. 4em 1em. 4em 20px;text-decoration:none;position:relative;}
#dialog_link Span.ui-icon {margin:0 5px 0 0;position:absolute;left:. 2em;top:50%;margin-top: -8px;}
</style>
<script type= "Text/javascript" language= "JavaScript" src= "Jquery-1.7.1.min.js" >
</script>
<script type= "Text/javascript" language= "JavaScript" src= "Jquery-ui-1.8.18.custom.min.js" >
</script>
<link rel= "stylesheet" href= "Ui-lightness/jquery-ui-1.8.18.custom.css"/>
<script type= "Text/javascript" language= "JavaScript" >
$ (function () {
$ ("#dialog"). Dialog ({
Autoopen:false,
buttons:[{
Text: "OK",
Click:function () {
$ ("#dialog"). Dialog ("Close");
}
},
{
Text: "Cancal",
Click:function () {
$ ("#dialog"). Dialog ("Close");
}
}
],
Position: "Top",//Popup position
width:600,//window width
HEIGHT:200,
Drag:function () {
Alert ("You drag Me to try");
}
});
$ ("#dialog_link"). Click (function () {
$ ("#dialog"). Dialog ("Open");
});
})
</script>
<body>
<a href= "#" id= "Dialog_link" class= "Ui-state-default ui-corner-all" ><span class= "Ui-icon Ui-icon-newwin" ></span>open dialog</a>
<!--dialog box $ ("#dialog"). Dialog () He is a dialog box that hides in the page-->
<div id= "Dialog" title= "Hi" style= "Display:none" >
Hello
</div>
</body>
Copy Code code as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title> Frame Cover Effect </title>
<style type= "Text/css" >
#dialog_link {padding:. 4em 1em. 4em 20px;text-decoration:none;position:relative;}
#dialog_link Span.ui-icon {margin:0 5px 0 0;position:absolute;left:. 2em;top:50%;margin-top: -8px;}
</style>
<script type= "Text/javascript" language= "JavaScript" src= "Jquery-1.7.1.min.js" >
</script>
<script type= "Text/javascript" language= "JavaScript" src= "Jquery-ui-1.8.18.custom.min.js" >
</script>
<link rel= "stylesheet" href= "Ui-lightness/jquery-ui-1.8.18.custom.css"/>
<script type= "Text/javascript" language= "JavaScript" >
$ (function () {
$ ("#dialog"). Dialog ({
Autoopen:false,
buttons:[{
Text: "OK",
Click:function () {
$ ("#dialog"). Dialog ("Close");
}
},
{
Text: "Cancal",
Click:function () {
$ ("#dialog"). Dialog ("Close");
}
}
],
Position: "Top",//Popup position
width:600,//window width
HEIGHT:200,
Drag:function () {
Alert ("You drag Me to try");
}
});
$ ("#dialog_link"). Click (function () {
$ ("#dialog"). Dialog ("Open");
});
})
</script>
<body>
<a href= "#" id= "Dialog_link" class= "Ui-state-default ui-corner-all" ><span class= "Ui-icon Ui-icon-newwin" ></span>open dialog</a>
<!--dialog box $ ("#dialog"). Dialog () He is a dialog box that hides in the page-->
<div id= "Dialog" title= "Hi" style= "Display:none" >
Hello
</div>
</body>
