html弹窗控件,jQuery弹框、弹出层插件method.js

846e1d859afd29768e68144a885ce446.png

8d356dd126880af192ae902c3e671bd1.png

插件描述:jq弹框 弹框标题、内容、宽高、取消确认按钮、关闭按钮、动效类型均可以参数的形式设置

更新时间:2017-12-20 10:20:20

更新说明:修复 自适应屏幕bug

更新时间:2017-12-19 15:56:24

更新说明:新增 小弹框  如 项目中很多时候需要弹框中 点击发送验证码  发送成功后的提示弹框

更新时间:2017-8-14 14:55:27

更新说明:1)优化弹框尺寸,优化后可不传弹框宽高,让弹框的宽高自适应

2)优化弹框内容,新增可通过传html路径来将html中的内容显示在弹框中

3)新增按钮的回调函数,点击取消或确定按钮后执行的操作。

配置说明:

type(表示切换显示效果):slideFromTop、slideFromBottom、showSweetAlert、none、layerFadeIn、layer-fadeInUpBig、layer-rollIn、layer-shake、layer-spread、layer-fadeIn

title(弹框标题):如不需要标题,则不需要传此参数

close(弹框关闭按钮):close属性为false为没有关闭按钮,close属性为true或无close属性则有关闭按钮

content/url:(弹框主要内容):如果内容简洁,可将内容放到content中。如内容比较复杂,可另建一个html文件(如a.html),

a.html中只需要放内容标签(你需要放html和body标签等),如我是弹框内容。配置参数中只需要传url:"a.html"

注:content和url必须选择其一,并且只能选择其中一项

btn表示按钮组,值为""的时候,则表示不显示该按钮。否则显示该按钮,如["","保存"]

callBack1表示点击完第一个按钮执行的回调函数

callBack2表示点击完第二个按钮执行的回调函数

area表示弹框的宽度和高度。如不传值则宽高自适应

使用方法

1、type值用来切换显示效果

type值:slideFromTop、slideFromBottom、showSweetAlert、none、layerFadeIn、layer-fadeInUpBig、layer-rollIn、layer-shake、layer-spread、layer-fadeIn

如:type:"slideFromBottom"

2、title用来设置标题,如不添加title属性,则弹框无标题。如title:"弹框标题"

3、close为关闭按钮,close值为false则没有关闭按钮,close值为true或者不添加close属性,则显示关闭按钮。如: close:"false"

4、content为弹框主要内容

5、area为弹框尺寸,如无area属性,则弹框尺寸自适应。如有area,则第一个值为宽,第二个值为高。如area:["500px","200px"]

6、btn为取消按钮和提交按钮组合,值为0则表示不显示。如: btn:[0,"保存"]

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值