插件官方地址:http://bootboxjs.com/

alert:

1
bootbox.alert("Hello world!"function() {});

dialog:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
bootbox.dialog({
  // dialog的内容
  message: "I am a custom dialog",
   
  // dialog的标题
  title: "Custom title",
   
  // 退出dialog时的回调函数,包括用户使用ESC键及点击关闭
  onEscape: function() {},
   
  // 是否显示此dialog,默认true
  show: true,
   
  // 是否显示body的遮罩,默认true
  backdrop: true,
   
  // 是否显示关闭按钮,默认true
  closeButton: true,
   
  // 是否动画弹出dialog,IE10以下版本不支持
  animate: true,
   
  // dialog的类名
  className: "my-modal",
   
  // dialog底端按钮配置
  buttons: {
     
    // 其中一个按钮配置
    success: {   
      // 按钮显示的名称
      label: "Success!",
       
      // 按钮的类名
      className: "btn-success",
       
      // 点击按钮时的回调函数
      callback: function() {}
    },
     
    // 另一个按钮配置
    "Danger!": {
      className: "btn-danger",
      callback: function() {}
    }
  }
});

默认的modal是固定宽度的,bootbox也不例外,那么如何让弹出框能自定义宽度呢?我们可以利用上面提到的dialog的className,定义一个class,然后对class设置width即可。

bootstrap插件bootbox参数和自定义弹出框宽度设置的更多相关文章

  1. bootstrap插件(对话框)bootbox参数和自定义弹出框宽度设置

    参考:https://hisune.com/post/view/17/bootstrap-plugin-bootbox-and-custom-width-dialog 官网:http://bootbo ...

  2. JS组件系列——Bootstrap寒冬暖身篇:弹出框和提示框效果以及代码展示

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...

  3. js自定义弹出框

    js自定义弹出框: 代码如下 <html> <head><title>自定义弹出对话框</title> <style type ="te ...

  4. android自定义弹出框样式实现

    前言: 做项目时,感觉Android自带的弹出框样式比较丑,很多应用都是自己做的弹出框,这里也试着自己做了一个. 废话不说先上图片: 实现机制 1.先自定义一个弹出框的样式 2.自己实现CustomD ...

  5. react native仿微信性别选择-自定义弹出框

    简述 要实现微信性别选择需要使用两部分的技术: 第一.是自定义弹出框: 第二.单选框控件使用: 效果 实现 一.配置弹出框 弹出框用的是:react-native-popup-dialog(Git地址 ...

  6. .NET MVC 学习笔记(四)— 基于Bootstarp自定义弹出框

    .NET MVC 学习笔记(四)—— 基于Bootstarp自定义弹出框 转载自:https://www.cnblogs.com/nele/p/5327380.html (function ($) { ...

  7. jquery实现自定义弹出框

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. Bootstrap方法为页面添加一个弹出框

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. unity 之 自定义弹出框

    一.弹出框的搭建: 布局如图:Message为整个父物体,并且添加UiMessage代码.panel为遮罩. MessageBox为整个提示框,Panel为标题,ok为确定按钮,cancel为取消按钮 ...

随机推荐

  1. 2011 ACM-ICPC 成都赛区A题 Alice and Bob (博弈动规)

    题目大意: 有K堆石子,每堆有Ki个.两人的操作能够是:             1 从某一堆拿走一个 假设该堆在此之后没有石子了.就消失             2 合并两个堆        求是否 ...

  2. AutoCAD如何添加网络打印机 添加公司打印机

    1 请确认你已经连接了这台网络打印机,你没法打AutoCAD图纸,但是应该能打Word文档.能打Word文档说明你驱动装好了,通信也没问题,只是AutoCAD的配置不对导致的.   2 点击打印,打印 ...

  3. Java之旅hibernate(2)——文件夹结构

    Hibernate的jar最好是到官网上进行下载.下载最新的稳定的版本号.之后进行解压,以下我们介绍一下hibernate的包结构. 1.      包结构 我们能够看到包文件夹结构发生了变化.我以5 ...

  4. grep结合awk简单用法

    一.grep简介: grep (缩写来自Globally search a Regular Expression and Print)是一种强大的文本搜索工具,它能使用正则表达式搜索文本,并把匹配的行 ...

  5. 使用qemu

    1 获取qemu启动linux kernel的log qemu-system-x86_64 -nographic -kernel xxx -initrd xxx -append "conso ...

  6. 【OI】对拍

    对拍的方法是先用生成器生成几组随机数据,然后用暴力算法和当前算法对比结果来确保正确性. 数据生成器: 引入cstdlib与ctime两个库,然后通过srand初始化随机数: srand(time(0) ...

  7. Interval 计时器

    语法: setInterval(代码,交互时间); 在执行时,从载入页面后每隔指定的时间执行代码. clearInterval( setInterval() 返回的 ID 值 ): 取消计时器 < ...

  8. Android7.0源码编译运行指南【转】

    见连接: http://blog.csdn.net/HardReceiver/article/details/52650303

  9. zabbix如何添加主机监控

    1,首先,监控的主机安装zabbix客户端.zabbix提供多种监控方式,我们这里监控的主机上边安装agentd守护端进行数据收集并监测. 其中客户端安装我们这里就不介绍了,请参考之前教程里边的客户端 ...

  10. 一位ACMer过来人的心得(转)

    刻苦的训练我打算最后稍微提一下.主要说后者:什么是有效地训练? 我想说下我的理解.很多ACMer入门的时候,都被告知:要多做题,做个500多道就变牛了.其实,这既不是充分条件.也不会是必要条件. 我觉 ...