★页面展示

★属性

属性

说明

默认值

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:同data的offsetTop

offsetLeft:同data的offsetLeft

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

 

★事件回调

方法

参数

描述

返回值

onCloseFun()

关闭弹窗事件

 

★示例

var Popup =  new ZJ.JIECL.UI.Popup({
// iframeUrl:"http://www.baidu.com",
content:'22',
width: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源码

基于jQuery的控件:弹框的更多相关文章

  1. 基于Jquery 简单实用的弹出提示框

    基于Jquery 简单实用的弹出提示框 引言: 原生的 alert 样子看起来很粗暴,网上也有一大堆相关的插件,但是基本上都是大而全,仅仅几句话可以实现的东西,可能要引入好几十k的文件,所以话了点时间 ...

  2. 基于jQuery鼠标点击弹出登陆框效果

    基于jQuery鼠标点击弹出登陆框效果.这是一款扁平样式风格的jQuery弹出层登陆框特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <input type=" ...

  3. jQuery树形控件zTree使用小结

    作者:Fonour 字体:[增加 减小] 类型:转载 时间:2016-08-02我要评论 这篇文章主要为大家详细介绍了jQuery树形控件zTree使用方法,zTree树插件的基本使用方法,感兴趣的小 ...

  4. Jquery获得控件值的方法

    一 Jquery获得服务器控件值的方法 由于ASP.NET网页运行后,服务器控件会随机生成客户端id,jquery获取时候不太好操作,google了下,总结有以下3种方法: 服务器控件代码:<a ...

  5. 根据条件决定My97DatePicker日期控件弹出的日期格式

    代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit ...

  6. jquery时间控件

    jQuery 时间控件推荐 博客分类: jQuery 时间控件   My97DatePicker  My97DatePicker是一个更全面,更人性化,并且速度一流的日期选择控件.具有强大的日期范围限 ...

  7. Web控件文本框Reset的功能

    在前一篇中<怎样实现Web控件文本框Reset的功能>http://www.cnblogs.com/insus/p/4120889.html Insus.NET只实现了文本框的功能.单个或 ...

  8. jQuery操作控件

    在项目中添加前台控件radio,操作两个div的显示和隐藏,其实是一个很简单的问题,但是费了老大劲才完成,也就是jQuery操作控件的一些基础知识.方法有三种,简单介绍: 1.给元素设置style属性 ...

  9. 精确到秒的JQuery日期控件

    项目中需要用到精确到秒的日期控件,到网上搜了一下,发现有一个JQuery控件可以实现该功能---TimerPicker.但是官网上没有提供该控件的完整Demo,而且没有提供汉化包,所以自己汉化了一下, ...

随机推荐

  1. 使用ansible实现轻量级的批量主机管理

    作者:邓聪聪 查看ansible配置文件下的hosts的文件 [root@ansible-server scripts]# cat /etc/ansible/hosts [test] 172.16.1 ...

  2. WPF 10天修炼 第三天- Application全局应用程序类

    Application对象 当一个WPF应用程序启动时,首先会实例化一个全局唯一的Application对象,类似于WinForm下的Application类,用于控制整个应用程序,该类将用于追踪应用 ...

  3. iOS里的crc校验问题

    首先推荐一篇文章,下面的的文章对crc解释的很好: https://blog.csdn.net/liyuanbhu/article/details/7882789 crc校验算法的本质就是对一个2进制 ...

  4. linux 磁盘io监控

    我们在线上linux服务器排查问题时,一般会通过top.free.netstat.df -h等命令排查cpu.内存.网络和磁盘等问题.有的时候我们需要更进一步了解磁盘io的使用情况,那么本文就是重点讲 ...

  5. unity中调试模型时unity崩溃问题

    这个问题是在我调试3D模型资源时出现的,每当在Scene场景中调试模型时unity崩溃,出现Unity Bug Reporter页面,反复出现这个问题,很烧脑 对于这个问题我表示很无语,但是经过不断查 ...

  6. spring-data-rest的魔力 10分钟实现增删改查

    目录 创建项目 启动项目 添加person 查看person 及 person 列表 条件查询 分页查询 controller 去哪里了 自定义 spring-data-rest 魔力之外的contr ...

  7. Ubuntu 下使用 Nginx 部署 .NET Core 2.0 网站

    前言 本文介绍如何在 Ubuntu 16.04 服务器上安装 .NET Core 2.0 SDK.创建项目与发布,并使用 Nginx 部署 .NET Core 2.0 Web 项目. 安装 .NET ...

  8. 单机千万级MQTT连接服务器测试报告

    目标:测试创建1000万客户端连接到服务器端,服务器操作系统 Linux(任意一款发行版服务器版本).分别在两台硬件一样的服务器,其中一台用于服务器端运行,另一台用于创建千万客户端连接客户端机器.在硬 ...

  9. SOUI新组件SIpcObject介绍

    SIpcObject是一个基于Windows消息及共享内存的一个IPC(跨进程函数调用)的组件. GITHUB上有很多IPC模块,我这里又造了一个轮子,不一定比现有的IPC更好,不过我觉得已经足够简单 ...

  10. html_之css

    css 有三种形式的写法: 直接在标签里写入style样式 在<head></head>里写入<style></style>样式 直接创建.css 文件 ...