jquery UI(笔记)-优快云博客

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>jquery_UI1.5(dialog)例子</title> 
<link rel="stylesheet" type="text/css" href="css/jquery-ui.css">
<script type="text/javascript" src="js/jquery-1.5.1.js"></script> 
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-i18n.min.js"></script><!--国际化-->
<script type="text/javascript"> 
$(function() {
		
	
		$( "#dialog-modal" ).dialog({
			height: 160,
			stack:false,
			modal: true,
			title:"title",
			closeOnEscape:false,
			closeText:'关闭', 
			resizable:false,
			close:function(){
				
			},
			buttons: [
						{
							text: "Ok",
							click: function() { $(this).dialog("close"); }
						}
					] 
		});
	});
</script> 
<style type="text/css"> 

</style> 
</head> 
<body style="font-size:62.5%;"> 
这是body的内容
ui-corner-all { -moz-border-radius: 4px/*{cornerRadius}*/; -webkit-border-radius: 4px/*{cornerRadius}*/; border-radius: 4px/*{cornerRadius}*/; }	//表示header显示圆边框
.ui-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; }		//padding: .2em表示dialog的padding距离
<div id="dialog-modal" >
	<p>Adding the modal overlay screen makes the dialog look more prominent because it dims out the page content.</p>
</div>
</body> 
</html>