文档章节

Bootstrap-多层模态框滚动条失效解决办法

小小莹07
 小小莹07
发布于 2017/05/04 16:34
字数 184
阅读 70
收藏 0

Bootstrap-多层模态框滚动条失效解决办法

Bootstrap官方不支持模态框多层叠加,实际项目使用时需要弹出两层弹出层,当弹出第一个弹出层时,滚动条正常,弹出第二个弹出框并关闭时,滚动条事件被吃掉覆盖。主要原因是因为遮罩问题引起的,最简单的解决办法就是在第二个弹窗关闭事件时给body重新添加遮罩层。具体代码如下:

$("body").addClass("modal-open");

重新添加后,关闭第二个弹窗时滚动条事件依然有效。亲测。 模态框

© 著作权归作者所有

共有 人打赏支持
上一篇: Markdown语法入门
下一篇: Markdown语法入门
小小莹07
粉丝 0
博文 2
码字总数 648
作品 0
沈阳
程序员
私信 提问
4.17、Bootstrap V4自学之路-----组件---模态框

由于HTML5定义了它的语义, HTML 属性在Bootstrap模态框中产生不了影响。为了实现同样的效果,使用一些自定义JavaScript: $('#myModal').on('shown.bs.modal', function () { $('#myInput')......

Asktao
2016/03/25
54
0
求教bootstrap modal模态框第一次加载时遮盖页面按钮的问题

我在用bootstrap做一个web应用时,遇到了这样的问题,我的页面通过点击添加或者编辑会弹出一个模态窗口,第一次访问页面时不显示的,但是我页面上有一个搜索框,当我点击时,发现按钮不可用,...

601983016
2015/11/10
2.8K
5
Bootstrap学习笔记--插件之Carousel插件轮播图片,模态插件,提示插件,滚动监听插件,Affix插件

轮播插件: 插件: 轮播插件。 是一个通过元素循环的组件,如旋转木马(幻灯片) 插件可以单独包含(使用Bootstrap“carousel.js”文件),或者一次全部使用(使用“bootstrap.js”或“boots...

codingcoge
2018/05/28
0
0
Bootstrap3-技巧之解决Bootstrap模态框切换时页面抖动 or页面滚动条

Bootstrap3-技巧之解决Bootstrap模态框切换时页面抖动 or页面滚动条 Bootstrap为了让所有的页面(这里指内容溢出和不溢出)显示效果一样,采取的方法如下: 当Modal显示时,设置body -- ove...

517270667
2017/07/12
0
0
div在模态窗口层下面,怎么让他在最上面啊

1.弹出地图册用的是Bootstrap 模态窗口 2.在用百度的模糊匹配地图搜索框的时候,发现弹出的div层都在模态窗口的下面。改了z-index:9999也没用 急求解决办法啊。

MTTT
2015/05/26
857
2

没有更多内容

加载失败,请刷新页面

加载更多

全面理解Java内存模型(JMM)及volatile关键字

理解Java内存区域与Java内存模型 Java内存区域 Java虚拟机在运行程序时会把其自动管理的内存划分为以上几个区域,每个区域都有的用途以及创建销毁的时机,其中蓝色部分代表的是所有线程共享的...

亭子happy
12分钟前
1
0
Prometheus监控mysql实例--centos7安装mysql_exporter

目录 概述 环境准备 普罗米修斯简介 mysql安装 mysqld_exporter安装 启动参数列表 概述 prometheus(普罗米修斯) 是一个开源系统监控和报警工具包,许多公司和组织都采用了Prometheus,该项目...

java_龙
18分钟前
3
0
拥有2000家门店,他如何晋升为服装界的新宠?

摘要: —— iwarm3.0加热组件、碳纳米管膜炎、管状石墨结构体...你看到并不是一款高科技电子产品,这是快鱼服饰在这个冬天推出的黑科技产品 - 智能温控羽绒服。 在竞争激烈的服装行业,快鱼...

阿里云云栖社区
20分钟前
2
0
不忘初心 砥砺前行-智和信通2018年年会报道

1月18日,智和信通以“不忘初心 砥砺前行”为主题的2018总结会议暨2019年年会在京召开。年会以总经理李少龙的讲话为开场,充分肯定了全体员工2018年的工作和成绩,并表达了公司产品智和网管平...

智和网管平台
28分钟前
1
0
NGINX api网关

以谁为师
30分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部