模态框

泛互动前端 模态框

创建自定义模态窗口可以在modal层添加类 .inmodal 实现

可选尺寸

模态框提供了两个可选尺寸,通过为 .modal-dialog 增加一个样式调整类实现。

带动画模态框

您可以添加任何动画效果到您的模态窗口。只从css动画页面中提取一些效果并将其添加到 .modal-content 所在的类.

选项

选项可以通过数据属性或JavaScript传参。对于数据属性,将选项名附加到 data-, 如 data-backdrop="".

名称 类型 默认值 描述
backdrop boolean 或 string 'static' true 遮罩层,或使用static单击遮罩层不关闭模态窗口
keyboard boolean true 键盘上的 esc 键被按下时关闭模态框。
show boolean true 模态框初始化之后就立即显示出来。
remote path false

This option is deprecated since v3.3.0 and will be removed in v4. We recommend instead using client-side templating or a data binding framework, or calling jQuery.load yourself.

如果提供的是 URL,将利用 jQuery 的 load 方法从此 URL 地址加载要展示的内容(只加载一次) 并插入 .modal-content 内。如果使用的是 data 属性 API,还可以利用 href 属性指定内容来源地址。下面是一个实例:

<a data-toggle="modal" href="remote.html" data-target="#modal">Click me</a>