zoukankan      html  css  js  c++  java
  • jquery中dialog下的属性讲解


    <!-- 基础类库 -->
    <SCRIPT type="text/javascript" src="js/jquery-1.4.4.min.js"></SCRIPT>
    <!-- 布局的基本类库(不涉及到布局不需要)-->
    <SCRIPT type="text/javascript" src="js/jquery.layout.js"></SCRIPT>
    <!-- ui的样式表 -->
    <link type="text/css" href="css/redmond/jquery-ui-1.8.9.custom.css" rel="stylesheet" />
    <!-- ui的类库 --> 
    <script type="text/javascript" src="js/jquery-ui-1.8.9.custom.min.js"></script>
    <SCRIPT type="text/javascript">
    $(document).ready(function () {
      //制定某个div的id 将其作为 Dialog   
      $('#helpdialog').dialog({
         //是否创建就打开对话框,也就是是否页面一打开就显示对话框
         autoOpen: false,
         
         /*是否需要解决无法覆盖IE6 select 元素无法被覆盖的bug
         就是在IE6下  div无法覆盖<select></select> 是否使用那该属性解决
         */
         bgiframe:true,
         
         //设置对话框宽度
          600,
         
         //设置对话框高度
         height: 260,
         
         /*
          设置对话框底部的按钮
         */
         buttons: {
          "确定": function() {
           //单击按钮后的回调函数,就是按钮被单击后的响应事件
           $(this).dialog("close");
          }
          /*
          "取消": function() {
           $(this).dialog("close");
          }
          */
         },
         
         /*
          是否为对话框添加ESC快捷键
         */
         //closeOnEscape: false,
         
         //对话框是否可以被拖动
         draggable:false,
         
         //打开对话框时是否使用特效
         show:"slide",
         //关闭对话框时是否使用特效动画
         hide: "slide",
         
         //是否可以调整对话框的大小
         resizable:false,
         
         //调整对话框的高度和宽度极限值(当resizable:true时)
         //maxHeight:520
         //maxWidth:620
         //minHeight:320
         //minWidth:220
         
         //是否为模态窗口,设置为 true 时,页面上其它元素将被覆盖且无法响应用户操作。也就是无法再主界面上进行其他操作
         modal:true,
         
         //是否可覆盖其它对话框
         //stack:false
         
         //对话框标题(也可以再div的title上进行设置)
         title:"请登陆"
         
         //设置对话框 CSS z-index 值
         //zIndex:50
        });
        // 对话框的打开连接
        $('#helpdialog_link').click(function(){
         $('#helpdialog').dialog('open');
         return false;
        });
    });
    </SCRIPT>
    <BODY> 
    <a href="#" id="dialog_link">从此处打开对话框</a></span>
     <div id="helpdialog" title="对话框的标题">
      <p>对话框的内容</p>
     </div>
    </BODY>
  • 相关阅读:
    A Simple Problem About Truth Table
    Android Fragment完全解析,关于碎片你所需知道的一切
    Android系统中标准Intent的使用
    Android应用开发全程实录-你有多熟悉listView
    Android四大基本组件介绍及生命周期
    设计模式
    Java流(Stream)、文件(File)和IO
    Java网络编程详解
    Java 多线程
    深入理解Java虚拟机 精华总结(面试)
  • 原文地址:https://www.cnblogs.com/yangqqq/p/13265180.html
Copyright © 2011-2022 走看看