插件官方地址: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. struts1与struts2的差别

     Struts 2是Struts的下一代产品,是在 struts 1和WebWork的技术基础上进行了合并的全新的Struts 2框架.其全新的Struts 2的体系结构与Struts 1的体系结 ...

  2. 推荐IOS开发3个工具:Homebrew、TestFight、Crashlytics-b

    1. Homebrew 什么是Homebrew? Homebrew is the easiest and most flexible way to install the UNIX tools App ...

  3. selenium第三课(selenium八种定位页面元素方法)

    selenium webdriver进行元素定位时,通过seleniumAPI官方介绍,获取页面元素的方式一共有以下八种方式,现按照常用→不常用的顺序分别介绍一下. 官方api地址:https://s ...

  4. PH_Pooled Featrues Classification MIREX 2011 Submission

    Abstract Principal Mel-Spectrum Components (Feature) Temporal Pooling Functions (Model) Single Hidde ...

  5. ios跟踪工具introspy使用

    1.cydia安装introspy,前提要安装Applist (雷锋源)     2.设置中有introspy-Apps instrospy-Settings选项. 可以选择需要跟踪的app以及跟踪内 ...

  6. 局部优化与整体效果 新增时间>节省时间 权衡利弊

    原代码 from selenium import webdriverimport requests,timeurl_l=[]with open('DISTINCT_url.txt', 'r', enc ...

  7. input title 悬浮值

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

  8. HDU 1023 Catalan数+高精度

    链接:HDU 1023 /**************************************** * author : Grant Yuan * time : 2014/10/19 15:5 ...

  9. HTTP要点概述:十,内容协商

    一,内容协商(Content Negotiation) 同一个Web网站可能存在很多份相同内容的页面,比如英文版和中文版的Web页面,它们内容上相同,但是使用语言不同.比如大家进入英文版的google ...

  10. 4.7.6 Compaction of LR Parsing Tables

    4.7.6 Compaction of LR Parsing Tables A typical programming language grammar with 50 to 100 terminal ...