溢出-无法在身体上正常工作

时间:2018-11-14 18:29:22

标签: html css css3 css-transitions

我在容器中居中放置了一个简单的div,如下所示:

.popup-fixed-info{
    position:fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) !important;
    overflow-y:scroll;
    max-height:80%;
    visibility:hidden;
    opacity:0;
    z-index:10;
}

在元素上单击,我称之为简单的jQuery函数

function open_popup(class_to_open) {
  $('.popup-fixed-info').css("visibility", "visible");
  $('.popup-fixed-info').css("opacity", "1");
}

想法是,当我滚动'.popup-fixed-info'div时,背景滚动而不是div本身。.

1 个答案:

答案 0 :(得分:0)

要解决此问题,您需要隐藏身体溢出。在jQuery中执行此操作:

function open_popup(class_to_open) {
  $('.popup-fixed-info').css("visibility", "visible");
  $('.popup-fixed-info').css("opacity", "1");
  $('body').css("overflow", "hidden");
}

然后在关闭弹出窗口时将其删除。无论您有什么功能。

$('body').css("overflow", "auto");