zoukankan      html  css  js  c++  java
  • 弹出框插件——dialog

    基于jquery和dot.js弹出框插件,兼容IE6+等其他浏览器。

    思想:弹出框元素插入body节点中,并在页面垂直居中显示(fixed定位),触发确定和关闭事件绑定。

    注意ie6包含两个问题:
    一、select、flash不能遮罩,采用iframe。
    二、fixed属性采用滚动时重新计算高度或在样式中采用表达式计算expression。

    源码分析:
    1、creatHtml:采用doT.js初始化元素添加到body中;
    2、show:设置宽度,高度,居中显示;
    3、events:为关闭和确定绑定事件;
    4、removeCallback:移出元素节点,如有执行回调方法;
    5、ie6fixed:ie6中fixed的兼容性处理。

    参数使用说明:

    width:定义弹出框的宽度,默认值是400。
    height:定义弹出框的高度,默认值是100.
    title:定义弹出框的标题,默认值是空。
    html:定义弹出框的内容,默认值是空。
    type:定义弹出框的类型,默认值是default,其他conform和alert。
    closed: 标题栏中的关闭按钮,回调方法,默认为null。
    conform:包含name指按钮的名称,默认值为确定,callback回调方法,默认值为null。
    cancel:包含name指按钮的名称,默认值为取消,callback回调方法,默认值为null。
    备注:如果使用conform或alert时,不设置type类型是不起作用。


    放在页面底部,作为公用部分:



    使用方法:

    $.Dialog.init({
        height: 180,
        title: "弹出框",
        html: "亲,默认弹出框哦",
        closed: function() {
            alert("关闭");
        }
    });



    github地址:https://github.com/benpaobenpao/dialog

    DEMO:



  • 相关阅读:
    字符串,format格式化及列表的相关进阶操作---day07
    利用wiile双层循环打印各种星星---day06
    双层循环练习,pass_break_continue,和for循环---day06
    类型判断,代码块,流程控制及循环---day05
    频繁项集算法
    Unity 物体移动的理解
    Game1---游戏设计
    精读Hadamard Response论文
    java 创建线程
    Unity游戏开发面试基础知识
  • 原文地址:https://www.cnblogs.com/kuikui/p/3516575.html
Copyright © 2011-2022 走看看