模擬dialog效果

<!-- 引入jquery類庫文件-->
<script src="../jquery/jquery-1.7.1.js"></script>
<script src="../jquery/jquery-ui-1.8.18.custom.min.js"></script>
<!--引入css-->
<link rel="stylesheet" href="../jquery/css/jquery-ui-1.8.18.custom.css" />
<script>
  $(function(){
	  //註冊對話框
	   
	   $("#dialog").dialog({
		  autoOpen:false , //設置對話框的打開方式不是自動打開   
		  show:'blind', //打開時的動畫效果
		  hide:'explode', //關閉時的動畫效果
		  modal:true,  //遮罩效果   false 非遮罩效果
		  resizable:false,
		 /* buttons:{  //添加按鈕操作
			  "確定":function(){
				 //alert("確定"); 
				  $(this).dialog("close");
			  },
			  "取消":function(){
				// alert("取消");
				$(this).dialog("close");    
			  }
		  },*/
		  //效果與上邊的buttons效果相同
		  buttons:[
		      {
			     text:"ok",
				 click:function(){
					 $(this).dialog("close"); 
				 }
			  },
			  {
			     text:"取消",
				 click:function(){
					 $(this).dialog("close"); 
				 }
			  }],
		  draggable:true, //是否可以拖動  默認true 可以拖動
		  closeOnEscape:false , //是否採用esc鍵退出對話框 默認值是true 採用
		  title:"添加用戶",//對話框的標題
		  position:"top", //對話框彈出的位置 可以使用top left right bottom center默認值是center
		  width:400,  //設置對話框的寬度
		  height:400,  //對話框的高度
		  resixable:false,  //是否改變的操作  false則不可以改變尺寸  true 不可以 
		  zIndex:2, //層疊的效果
		  drag:function(event,ui){
			 $("#dialog").html("文本框添加"); 
			 //可以的到當前的座標位置
		  }
		  
	   });
	   
	   
	   //觸發鏈接事件，當點擊連接時 打開對話框
	  $("#dialog_link").click(function(){
		 $("#dialog").dialog("open");//open參數 作用 打開對話框
	  });
	  
	  //怎樣獲取 設置的options中的參數值
	  var modalValue=$("#dialog").dialog("option","modal");
	  alert(modalValue);
	   //我怎麼設置options中的參數值
	  $("#dialog").dialog("option","modal",false);
	    
  });
</script>
  

<!--
jquery UI使用前提 
  第一步
     引入別人的類庫文件
     js類庫
     css樣式類庫文件
   第二步：模擬實現
   
 
-->

 
      <!--創建連接-->  
    <a id="dialog_link" class="ui-state-dfault ui-corner-all" href="##"><span> </span>open </a>    
  <!--div $("#dialog").dialog() 他就成了一個對話框 在頁面中就會隱藏-->
 <div id="dialog" title=" 文本框中的title">
  文本框中的內容
 </div>