Question

我正在使用Bootstrap popover来创建一个可以长达几页的动态列表。我只是添加了一个溢出：滚动到它并且它可以工作，但是如果页面比列表长，它会继续滚过弹出窗口。

弹出窗口打开时是否可以禁用滚动背景内容？

换句话说，在禁用滚动背景内容时，你可以有一个绝对定位的div滚动吗？

更新：根据两个答案修正了问题

ggplot(demo_m, aes(X, Y, ymin=lci, ymax=uci, col=factor(time))) + 
              geom_line() + 
              geom_ribbon(alpha=0.2) +
              facet_grid(time ~ .)

Answer 1

当模态打开时，将overflow: hidden;设置为body元素，将overflow: auto;设置为模式对话框。

为了更清楚，我们需要查看您的代码。

Answer 2

我做了一个非常简单的例子;

Scroll

你的弹出窗口应该在另一个div中：

<div id="shadow">
<div id="popup">
    <a id='close' href="#">Close</a>
</div>

然后尝试在根div上添加这些CSS代码：

#shadow{
display: none;
position: fixed;
top:0;
bottom: 0;
width: 100%;
height:100%;
background-color: rgba(0,0,0,0.6);
}

**然后就是小JS的伎俩：**

  $('#open').click(function(e){
   e.preventDefault()
   $('body').width($('body').width());
   $('body').css('overflow', 'hidden');
   $('#shadow').css('display', 'block');
  })
   $('#close').click(function(e){
   e.preventDefault()
   $('body, #shadow').removeAttr('style')
})

希望它能帮助......：）

绝对定位div，防止背景滚动

2 个答案: