Bootstrap是如何让Modal滚动的&而不是其他的？
Bootstrap是一个流行的前端开发框架，它提供了丰富的组件和样式，方便开发人员快速构建响应式网页。Modal是Bootstrap中的一个组件，用于创建弹出窗口。
要让Modal滚动，可以通过以下步骤实现：
- 在Modal的外层添加一个固定高度的容器，例如一个div元素，并为其设置合适的高度和样式，例如设置
max-height和overflow-y: auto属性。这将创建一个可滚动的区域。 - 将Modal的内容放置在这个容器内部。可以使用Bootstrap提供的各种组件和样式来构建内容。
- 如果Modal的内容超过容器的高度，容器将自动显示滚动条，并且用户可以通过滚动条或鼠标滚轮来滚动内容。
这样，通过将Modal的内容放置在一个固定高度的容器中，设置容器的样式使其可滚动，就可以实现Modal的滚动效果。
关于Bootstrap Modal的更多信息和使用方法，可以参考腾讯云的相关文档和示例：
相关·内容
我正在创建一个像Bootstrap这样的模式&一切都很好。我注意到的唯一一件事是Bootstrap防止BODY标签在more打开时溢出，但是more有这个属性，如果more中的内容超过屏幕的高度...，这是怎么做到的？我添加了overflow: hidden；到body，当modal打开时& overflow: auto；到modal，但它不工作...
浏览 0提问于2016-07-19得票数 0
回答已采纳
3回答
我正在使用Twitter Bootstrap的模式窗口，我注意到当你滚动时，模式弹出窗口保持不变，而背景页面移动。对于demo，您可以在下面的页面中点击“启动demo modal”按钮：
如何避免这种情况，让scroll event控制模式窗口呢？Bootstrap提供的选项似乎不包括这一点。模式弹出窗口是一个带有position: fixed的<div>，这就是为什么我滚动<
浏览 1提问于2013-01-28得票数 2
6回答
活动模式依赖于用户当时正在做的事情，所以我想做一些包含所有内容的事情。$('.modal').modal('toggle');
当超时发生但我的情态仍然存在时。
浏览 0提问于2013-07-31得票数 53
回答已采纳
16回答
我试图将大量文本放入使用Twitter Bootstrap创建的模式框中，但我遇到了一个问题:内容拒绝滚动。我尝试添加overflow:scroll和overflow-y:scroll，但都无济于事；这只会导致它显示滚动条，而不是实际启用滚动。
这背后的原因是什么?我能做些什么？
浏览 0提问于2011-09-22得票数 75
1回答
使用Bootstrap 3.3.1，我能够获得堆叠的modal，而不需要任何额外的脚本(比如在Bootstrap站点中复制粘贴模态模板，并使其中许多模板位于同一个页面中)。问题是，每当顶部(最高)模式关闭时，滚动焦点就会转到主页(在所有剩余的modals下)，并且只有在打开一个新模式时才返回到顶部模式。是否有办法将滚动焦点设置为下一个模式，而不是主页？当我测试解决方案时， (甚至<
浏览 2提问于2014-12-09得票数 10
回答已采纳
6回答
我在一个单页网站上使用twitter bootstrap modals。当我单击按钮打开模式时，背景跳到页面顶部并打开模式。当您单击模式中的关闭按钮时，也会发生同样的事情。我尝试将下面的代码添加到我的CSS文件中。这阻止了背景跳到顶部，然而，我现在可以在打开模式的情况下滚动背景，这也是我不想要的。而且当我的模式溢出时，我可以同时看到模式和背景的滚动条。body.modal-open {
ov
浏览 10提问于2016-08-29得票数 1
5回答
我的网站有一个引导模式。我的最终目标是在模型中添加无限滚动，这样当用户滚动到模型的底部时，它会从服务器加载更多的数据，并将数据附加到模型中。我的问题是，如何检查用户是否接近滚动到模式
浏览 7提问于2017-06-04得票数 0
我使用的是fullpage.js和引导。我需要能够滚动，使用以下方法可以很好地工作： scrollOverflow: true,问题是当我使用Bootstrap模式时。我希望能够滚动模式覆盖，而不是滚动的身体下面。所以，我的问题是，当模态打开时，是否可以将scrollOverflow更改为false。我试过这个：
$(document)
浏览 6提问于2014-08-07得票数 0
回答已采纳
我正在使用Angular UI Bootstrap 。当模式打开时，body会有一个滚动。当我滚动模式后面的内容时，也会滚动。但是，如果我有很多内容在我的模式，我需要一个卷轴来显示。这个滚动不应该在模式中，也就是说，当我使用页面滚动时，模式应该只滚动而不是内容。
浏览 44提问于2013-12-13得票数 22
回答已采纳
我想显示react-bootstrap-modal，但只显示覆盖，而不显示模式 import Modal from 'react-bootstrap-modal'; </Modal<
浏览 151提问于2017-01-23得票数 10
回答已采纳
1回答
$(".modal").on("hide.bs.modal", function(){ });<div c
浏览 2提问于2015-10-26得票数 0
我在一个网站上使用了相当多的情态动词，在移动设备中，长的情态动词不会像它们应该的那样滚动；相反，网站会滚动。在Bootstrap4的文档中有一个。我想不出这种模式和普通模式之间的区别。在我看来是一样的。
浏览 0提问于2018-09-23得票数 2
当我第一次打开模式(“启动演示模型”按钮)时，垂直滚动条位于顶部位置。如果我向下滚动并在模式模式下单击“取消”，它将关闭。没问题的。但是如果我再次打开modal，它就已经向下滚动了。这是我想要避免的情况。我应该怎么做才能在顶部打开modal？
浏览 2提问于2013-10-30得票数 5
我见过这么多人问这个问题，但没有真正可靠的答案。ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/<em
浏览 0提问于2016-08-23得票数 5
回答已采纳
我目前正在从Bootstrap4 alpha迁移到Bootstrap4稳定。到目前为止，还不错，除了我的模特儿有这个问题。我在任何地方都使用下拉式，包括有很多物品的。以前，滚动器运行得很好。现在没有了:当我滚动时，这是正在滚动的模态过滤器(. modal背景)，而不是下拉列表。
下面是一个完整的页面示例：
浏览 1提问于2018-03-08得票数 3
回答已采纳
8回答
当我在页面中触发模式视图时，它会触发滚动条消失。这是一个恼人的效果，因为当模式移入/消失时，背景页面开始移动。有没有解决这种影响的方法？
浏览 87提问于2014-08-01得票数 105
回答已采纳
对于模式中的表单，我选择使用bootstrap模式页脚来显示与表单相关的任何错误。当错误不可避免地使页脚占据比页脚可用的高度更多的高度时，这会引起一些挫折。我同意它需要更多的高度，但我希望它将高度添加到顶部，并降低模式主体的高度，使模式作为一个整体保持相同的高度。如果它把它添加到底部，它最终会把内容从屏幕上推出去。模态正文说明了太“高”的内容，并添加了垂直滚动条，这就是为什么我愿意放弃模态正文高度来适应模态页脚高度。
浏览 2提问于2013-03-28得票数 3
我有一个bootstrap模板，其中我必须在一个模式中使用datepicker。modal的内容是可滚动的。当我单击datepicker字段并滚动页面时，datepicker与父页面引用一起滚动，而模态内容根本不滚动。同样，当模式被滚动时，datepicker停留在“固定”位置(因为父页面不被滚动)。关于如何在bootstrap中将模式弹出窗口作
浏览 24提问于2017-07-05得票数 1
3回答
加载jQuery模式后...如何让页面滚动条滚动模式而不是页面？谁能举个例子说明它是如何工作的？
提前感谢！:)
浏览 5提问于2014-08-28得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
