zoukankan      html  css  js  c++  java
  • Jquery对话框基本配置

    Jquery弹框以及常用参数配置 使用方法:

    $.createDialog({

      id : 'dialog'url:'/model/guide.html',//路由链接

      title:'弹框案列',//标题 width 700,

      height 620,

    });

    以上是基本的对话框,还有需求可使用以下参数配置:

      autoOpen 初始化之后,是否立即显示对话框,默认为 true

      modal 是否模式对话框,默认为 false

      closeOnEscape 当用户按 Esc 键之后,是否应该关闭对话框,默认为 true draggable 是否允许拖动,默认为 true

      resizable 是否可以调整对话框的大小,默认为 true

      title 对话框的标题,可以是 html 串,例如一个超级链接。

      position 用来设置对话框的位置,有三种设置方法

    位置参数设置

    position:一个字符串组成的数组,例如, ['right','top'],表示对话框将会位于窗口的右上角。

     一个字符串,允许的值为 'center', 'left', 'right', 'top', 'bottom'. 此属性的默认值即为 'center',表示对话框居中。 2. 一个数组,包含两个以像素为单位的位置,例如,

        var dialogOpts = {

        position: [100, 100]

    };

     

        var dialogOpts = {

        position: ["left", "bottom"]

    };

     

    堆叠

    stack     对话框是否叠在其他对话框之上。默认为 true

    zIndex   对话框的 z-index 值,一个整数,越大越在上面。默认 1000

     

    对话框打开或关闭效果

    当对话框关闭时的效果,默认为 null, 例如, hide: 'slide'

    show 当对话框打开时的效果。默认为 null 添加动画:

    show: {

            effect: "blind",

            duration: 1000

          },

          hide: {

            effect: "explode",

            duration: 1000

    }

    对话框是否叠在其他对话框之上。默认为 true

    对话框的 z-index 值,一个整数,越大越在上面。默认 1000

    按钮

     buttons:{
                "确定":function(){},
                "取消":function(){$(this).dialog('close');}
              }
    //点击其他按钮打开模态框
    $(“#opener”).click(function(){
         $(#dialog).dialog(“open”);
    }) 

    tips:去掉头部方法或者去掉右上角的关闭按钮。

    $.createDialog({

      closeOnEscape: false,//ESC关闭对话框

      id : 'dialog',

      url:'/model/guide.html',

      width : 700,

      height : 620,

      open: function (event, ui) {

      $(".ui-dialog-titlebar-close", $(this).parent()).hide();//去掉对话框右上角按钮

      $('.ui-dialog-titlebar').hide();//去掉对话框头部title }

    });

     

    参考链接:Jquery对话框参数配置

    -----原创文章,©版权所有,转载请注明标明出处:http://www.cnblogs.com/doinbean

  • 相关阅读:
    java国际化---native2ascii.exe 的使用方法
    Spring+SpringMVC+MyBatis+easyUI整合优化篇(十四)谈谈写博客的原因和项目优化
    Spring+SpringMVC+MyBatis+easyUI整合优化篇(十三)数据层优化-表规范、索引优化
    Spring+SpringMVC+MyBatis+easyUI整合优化篇(十二)数据层优化-explain关键字及慢sql优化
    Spring+SpringMVC+MyBatis+easyUI整合优化篇(十一)数据层优化-druid监控及慢sql记录
    Spring+SpringMVC+MyBatis+easyUI整合优化篇(九)数据层优化-jdbc连接池简述、druid简介
    Spring+SpringMVC+MyBatis+easyUI整合优化篇(八)代码优化整理小记及个人吐槽
    Spring+SpringMVC+MyBatis+easyUI整合优化篇(七)图片上传功能
    Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合
    Spring+SpringMVC+MyBatis+easyUI整合优化篇(五)结合MockMvc进行服务端的单元测试
  • 原文地址:https://www.cnblogs.com/doinbean/p/Jquery.html
Copyright © 2011-2022 走看看