V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
Terry05
V2EX  ›  分享创造

bDialog v2.1 发布 - Modal、Alert、Mask、Toast 等多模式的窗口

  •  
  •   Terry05 ·
    TerryZ · 2017-09-18 15:19:00 +08:00 · 2238 次点击
    这是一个创建于 2623 天前的主题,其中的信息可能已经有所发展或是发生改变。

    bDialog

    基于 Boostrap Modal 开发的可多层嵌套、定制灵活的模态窗口,功能包含 Modal、Alert、Mask、Toast 等多种模式

    插件功能预览

    模态窗口模式 Modal

    bDialogModal

    消息对话框模式 Alert

    bDialogAlert

    遮罩模式 Mask

    bDialogMask

    边角弹出通知框 Toast

    bDialogToast

    入门指南、DEMO、文档

    Github 项目地址:

    https://github.com/TerryZ/bDialog

    更多实例、文档请访问:

    https://terryz.github.io/bdialog/index.html

    如果您觉得项目还不错,还请给项目([Github](( https://github.com/TerryZ/bDialog)) / 码云)加个 Star,支持项目的开发

    主要特性

    • 基于 jQuery、bootstrap2,3 进行开发
    • 可多层嵌套,并拥有各自独立的上下文
    • 灵活的窗口元素定制
    • 模态窗口模式可载入服务端页面、远程页面、页面静态元素等内容
    • 消息对话框模式,包含 info、warning、error、success、confirm 等模式
    • 边角通知窗口模式,包含 info、warning、error、success 等模式,且有六个角落的显示位置
    • 遮罩模式,遮挡全部元素,待指定功能完成后,再移除遮罩,满足加载待的需求
    • 可在同一页面下展示各种不同样式、风格的窗口皮肤
    • 浏览器尺寸发生改变时,窗口将自动重新定位到浏览器中心区域
    • 模态窗口区域外点击、窗口自动定位等场景均有相应的提醒动画效果
    • 丰富的回调函数 浏览器支持 IE8+,chrome,firefox

    目标用户群体

    插件针对在项目中使用了 Bootstrap 作为基础 UI 框架,同时更希望使用 Bootstrap 原生态组件的群体。

    bDialog 开发之初,目的是为了统一开发团队对于 Bootstrap Modal 的使用方式,例如统一设置背景点击不关闭窗口,关闭底部按钮区域,统一设置参数接收,回调函数等基础功能;后续更是着重解决了窗口多层嵌套打开的功能需求,尤其是解决了该死的 IE8 下多层打开会导致浏览器崩溃的问题。

    Bootstrap 原生提供的功能组件,功能性相对较弱,bDialog 并不重新造轮子,而是在原生组件的基础上进行功能加强、扩展,使得更符合开发上的功能需求,通过不断的功能完善和问题修复,bDialog 插件就一直更新到了现在。几年来经过多个团队和多个项目的使用,将项目进行开源,希望项目可以让更多的团队,个人受益。

    4 条回复    2017-09-20 11:47:42 +08:00
    frozenthrone
        1
    frozenthrone  
       2017-09-18 15:39:25 +08:00
    差点看成大菠萝
    Terry05
        2
    Terry05  
    OP
       2017-09-18 15:55:03 +08:00
    @frozenthrone 这样很尴尬
    mrsen
        3
    mrsen  
       2017-09-20 10:42:34 +08:00
    感觉很丑啊
    Terry05
        4
    Terry05  
    OP
       2017-09-20 11:47:42 +08:00
    @mrsen 各花入各眼,审美各有高低这没毛病

    不过顺便讨论下,插件基本是实现了功能,而风格样式完全保留了 Bootstrap Modal 的原生风格,自定义的风格也基本采用极简洁的处理,为的就是让插件可以无痛适配各类已经使用了主题皮肤的 Bootstrap 系统

    所以我觉得你觉得丑的话,基本上也认为 Bootstrap 挺丑的吧?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1102 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 19:00 · PVG 03:00 · LAX 11:00 · JFK 14:00
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.