Bootstrap Modal 垂直居中 在 bootstrap.js中修改如下代码:

Modal.prototype.adjustDialog = function () {

var modalIsOverflowing = this.$element[0].scrollHeight > document.documentElement.clientHeight

 

this.$element.css({

paddingLeft: !this.bodyIsOverflowing && modalIsOverflowing ? this.scrollbarWidth : '',

paddingRight: this.bodyIsOverflowing && !modalIsOverflowing ? this.scrollbarWidth : ''

})

// 是弹出框居中。。。

var $modal_dialog = $(this.$element[0]).find('.modal-dialog');

var m_top = ( $(window).height() - $modal_dialog.height() )/2;

$modal_dialog.css({'margin': m_top + 'px auto'});

}

 

Bootstrap Model点击空白处 popup会关闭:

增加属性
data-backdrop="static"

Bootstrap使用后笔记的更多相关文章

  1. 《深入理解bootstrap》读书笔记:第4章 CSS组件(下)

    十. 标签(.label类,label-xxx) 高亮一些标题部分. 1 2 3 4 5 6 <h1>HELLO<span class="label label-defau ...

  2. 《深入理解bootstrap》读书笔记:第4章 CSS组件(上)

    bootstrap三大核心之二. 包括glyphicon图标,下拉菜单(dropdown),按钮组(button group)....等等. 一. 图标字体 bootstrap3提供了200多个免费图 ...

  3. 《深入理解bootstrap》读书笔记:第三章 CSS布局

    一. 概述一下理念 bootstrap基于H5开发.提倡移动先行(媒询声明是必须的),对浏览器支持面不是很广. 响应式图片:max-width:100% height:auto; 可以加上:.img- ...

  4. Bootstrap+JSP实例学习笔记一.简单的带登录功能的首页

    前言 Bootstrap 是流行的 HTML.CSS 和 JS 框架,用于开发响应式布局.移动设备优先的 WEB 项目.源自于twiteer内部的开发框架. 当前(2019-05)最新版本是v3.3. ...

  5. 《深入理解bootstrap》读书笔记:第二章 整体架构

    一.  整体架构   1. CSS-12栅格系统 把网页宽度均分为12等分(保留15位精度)--这是bootstrap的核心功能. 2.基础布局组件 包括排版.按钮.表格.布局.表单等等. 3.jQu ...

  6. 《深入理解bootstrap》读书笔记:第一章 入门准备

    一.bootstrap框架简介 Bootstrap是最流行的前端开发框架. 什么是框架:开发过程的半成品. bootstrap具有以下重要特性: (1)完整的CSS样式插件 (2)丰富的预定义样式表 ...

  7. css去掉使用bootstrap框架后打印网页时预览效果下的超链接

    在我们写网页的时候,超链接是链接各个页面的桥梁,也是搜索引擎爬虫(spider)收录网站页面的关键,因此,在每个网页中会有许多的超链. 今天,一个同行妹妹在使用了bootstrap框架来搭建自己的网站 ...

  8. Bootstrap 基础学习笔记(一)

    排版 (1)标题 Bootstrap标题样式进行了以下显著的优化重置: 1.重新设置了margin-top和margin-bottom的值,  h1~h3重置后的值都是20px:h4~h6重置后的值都 ...

  9. 《深入理解Bootstrap》读书笔记(一)

    栅格系统 实现原理 通过定义容器大小,平分12份,再调整内外边距,最后结合媒体查询. 通过一系列包含内容的行和列来创建页面布局.下面列出了 Bootstrap 栅格系统是如何工作的: 1.行必须放置在 ...

随机推荐

  1. SE16N使用方案总结

    SAP中直接修改表.视图的Tcode有SE16N和SM30. 另外,在EHP5版本及其更高的版本中,激活编辑功能是不被允许的,不过程序中是通过一个判断语句来限制的,可以通过将相关的判断值判断前加断点, ...

  2. Android 手机卫士--对话初次设置密码验证过程

    本文实现设置密码对话框的逻辑判断 本文地址:http://www.cnblogs.com/wuyudong/p/5940551.html,转载请注明出处. 首先添加上图按钮的监听事件代码 /** * ...

  3. IOS开发基础知识--碎片34

    1:第三方插件SKSTableView在IOS7.1.1出现闪退的问题 解决办法,修改其内部源代码: (NSInteger)subRow { id indexpath = [NSIndexPath c ...

  4. FMDB第三方框架

    FMDB是同AFN,SDWebImage同样好用的第三方框架,它以OC的方式封装了SQLite的C语言API,使得开发变得简单方便. 附上github链接https://github.com/ccgu ...

  5. SQL Server快捷键

    SQL Server快捷键 金刚 SQL Server 快捷键 自己汇总的键盘操作快捷键 F7 切换到对象资源管理器 F5 执行T-Sql语句 F6 跳转到列属性 Alt+Enter 表属性 其实还有 ...

  6. 关于UIApplication单例传值

    由于UIApplication的是一个系统级别的单例,那么就能够省去自己创建单例的方法,将需要需要的类对象,在UIApplication单例内声明一个,通过点语法来实现单个 需要调用的实现单例模式的类 ...

  7. DbVisualizer连接hbase

    1.添加phoneix驱动 (1).点击Tools--->Driver Manager- (2).新建一个驱动,名称为phoenix(名称随意),选择phoenix的客户端驱动,驱动类如图所示 ...

  8. 【转】java NIO 相关知识

    原文地址:http://www.iteye.com/magazines/132-Java-NIO Java NIO(New IO)是从Java 1.4版本开始引入的一个新的IO API,可以替代标准的 ...

  9. Android资源(图片)命名规范

    (转自:http://www.jb51.net/article/38796.htm) 图片命名注意: 1,不能以下划线("_")开头: 2,以数字加下划线("[0-9]_ ...

  10. 关于Hadoop的集群环境下虚拟机采用NAT方式连不上网的解决

    使用虚拟机搭建hadoop集群的时候采用的是NAT方式联网,但是会出现时常掉网的现象,查看后排查了很久也没有发现什么问题. 很可能是Windows下的NAT服务没有开启,这时候尽管虚拟机和主机是在一个 ...