基于jQuery的控件:弹框

★页面展示

★属性

属性

说明

默认值

div

Object

jQuery对象

$('body')

width

Number

控件的宽度

auto

height

Number

控件的高度

auto

title

String

弹框的头

‘提示’

content

String

弹框的内容

iframeUrl

String

弹出iframe的路径

offsetTop

Number||String

绝对定位top

:

top,bottom,数字

居中

offsetLeft

Number||String

绝对定位left

:

left,right,数字

居中

isDrop

Boolean

是否可拖动

true(可拖动)

btnGroupe

Array[Object]

脚部的按钮,属性:

word:(String)按钮的文字

className:(String)按钮的class,提供grey,green,red,blue

onClick:(Function)按钮的点击事件

className

控件class

 

★方法

方法

参数

描述

返回值

Create()

创建弹出层

Open()

打开弹框

Close()

关闭弹框

FastOpen()

快速打开

FastClose()

快速关闭

SetWidth(width)

width:(Number)

设置控件宽度

SetHeight(height)

height:(Number)

设置控件内容高度

Refresh()

 

如果是iframe,则刷新

SetTop()

 

弹框置顶

SetMiddle(width,height)

width:(Number)

height:(Number)

设置弹框宽高,并居中

SetPosition(offsetTop, offsetLeft)

offsetTop:dataoffsetTop

offsetLeft:同dataoffsetLeft

设置弹框的位置,不传值默认是初始化传入的值

 

★事件回调

方法

参数

描述

返回值

onCloseFun()

关闭弹窗事件

 

★示例

var Popup =  new ZJ.JIECL.UI.Popup({
//            iframeUrl:"http://www.baidu.com",
    content:'22',
    800,
    height:600,
    btnGroupe:[{
        word:'取消',
        className:'grey',
        onClick:function(){
            Popup.Close();
        }
    },{
        word:'确定',
        onClick:function(){
            Popup.Open();
        }
    }],
    offsetTop:100,
    onCloseFun:function(){
        console.log(1)
    }
});
Popup.Open();

★源码

Js源码

Css源码

原文地址:https://www.cnblogs.com/kcat/p/10653082.html