插件官方地址: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. Chromium硬件加速渲染的UI合成过程分析

    在Chromium中.Render端和WebGL端绘制出来的UI终于是通过Browser端显示在屏幕上的.换句话说.就是Browser端负责合成Render端和WebGL端的UI.这涉及到不同Open ...

  2. 【项目实战】---使用ajax完毕username是否存在异步校验

    小伙伴在上网的时候.须要下载或者观看某些视频资料,更或者是在逛淘宝的时候.我们都须要注冊一个用户,当我们填写好各种信息,点击确定的时候.提示username已经存在.小编就想,为什么当我们填写完use ...

  3. 基于Office 365 无代码工作流分析-数据源的建立!

     标准操作步骤 下面整个步骤我们是以嘉昊信息的招聘过程的整个流程为一个场景,整个的流程场景的步骤例如以下: 整个的过程,我们通过Infopath 进行对应的表单流转,然后利用Sharepoint ...

  4. Linux系统编程_6_进程环境(C程序典型的存储空间)

    1.八种结束Linux进程的方法: 五种正常终止方式: main函数返回: 调用exit: 调用_exit或_Exit 最后一个线程从其启动例程返回 最后一个线程调用pthread_exit 三种异常 ...

  5. ZOJ3662:Math Magic(全然背包)

    Yesterday, my teacher taught us about math: +, -, *, /, GCD, LCM... As you know, LCM (Least common m ...

  6. redis 的部分配置

    linux 安装: yum install redis 修改redis配置: 配置文件位于/etc/redis.conf. 作为守护进程运行(默认no) # 默认情况下 redis 不是作为守护进程运 ...

  7. linux 查看php扩展

    php -i |less 查看配置文件在哪里,编译参数 php -m |less 查看php加载的模块 less可以自由的上下访问,比more要灵活一点. 如果不使用less,信息一次性给予,不太好查 ...

  8. zoj 3023 Light Bulb

    题目大意: 求L的最大值 思路: 可以想象出是一个关于人到灯泡距离x的单峰上凸函数 当光线在墙角左边的时候影子在不断增长 然后通过相似可以推出人在墙上影子的长度为:H+D*(h-H)/x 再加上地上的 ...

  9. bzoj4870

    http://www.lydsy.com/JudgeOnline/problem.php?id=4870 矩阵快速幂... 人话题意:从nk个物品里选模k余r个物品,问方案数模P 那么我们有方程 f[ ...

  10. Eclipse 使用Anaconda python 解释器

    问题: ubuntu16.04 Anaconda 安装成功 Eclispe 写Python代码 无法使用 (pandas库等) 原因: Eclispe 此时的python解释器==>用的并不是A ...