jquery-dialog对话框的实现
<!--引入jquery类库文件-->
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/jquery-ui-1.8.18.custom.min.js"></script>
<!--引入css样式类库-->
<link rel="stylesheet" type="text/css" href="css/jquery-ui-1.8.18.custom.css"  
/>
/*juqery代码部分*/
<script>
$(function (){
   //注册对话框
  $('#dialog').dialog({
    autoOpen:false,  //设置对话框打开方式 不是自动打开
    show:'blind',    //打开时的动画效果
    hide:'explode',  //关闭时的动画效果
    modal:ture,      //遮罩效果 false:非遮罩效果
    title:'添加用户操作界面',  //对话框标题
    position:'top',   //打开对话框的位置  top left rigth
    width:200,        //代表的是对话框的宽度
    height:200,       //代表的是对话框的高度
    drag:function(event,ui){
     //可以测试 对话框当前的坐标位置
     $('#dialog').html('我来拽哈!');
      }
   });
//触发连接事件 当你点击 连接 打开一个对话框
 $('#dialog_link').click(function (){
   $('#dialog').dialog('open');
   });
});
</script>

/*html代码部分*/
<h1>模拟dialog对话框效果</h1>
<!--创建一个连接-->
<a href="#" id="dialog_link" class="ui-state-default "><span></span>open  
dialog</a>
<!--div对话框 $('#dialog').dialog(); 它就成了一个对话框 在页面中就会隐藏-->
<div id="dialog" title='hi'>嘿嘿</div>

效果图:1.  
       2.  
3. 
 
当拖动时显示3

阅读更多
想对作者说点什么? 我来说一句

jquery-ui-dialog-demo

2014年01月07日 90KB 下载

jquery-dialog

2013年08月02日 2KB 下载

jquery-dialog demo

2012年08月18日 39KB 下载

java实现选择对话框

2011年06月15日 1KB 下载

对话框实现加减乘除

2014年06月24日 1.83MB 下载

使用Fragment实现对话框

2018年01月05日 16.21MB 下载

没有更多推荐了,返回首页

不良信息举报

jquery-dialog对话框的实现

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭