Question

我已经在jQuery弹出模式中添加了一个滚动条，它现在覆盖了我的关闭按钮。有人可以解释如何在滚动条前面按下按钮。提前谢谢。

在：

后：

的CSS：

/* Close Button */
.popup-close {
    width:30px;
    height:30px;
    padding-top:4px;
    display:inline-block;
    position:absolute;
    top:0px;
    right:0px;
    transition:ease 0.25s all;
    -webkit-transform:translate(50%, -50%);
    transform:translate(50%, -50%);
    border-radius:1000px;
    background:rgba(0,0,0,0.8);
    font-family:Arial, Sans-Serif;
    font-size:20px;
    text-align:center;
    line-height:100%;
    color:#fff;;
}

.popup-close:hover {
    -webkit-transform:translate(50%, -50%) rotate(180deg);
    transform:translate(50%, -50%) rotate(180deg);
    background:rgba(0,0,0,1);
    text-decoration:none;
}

.popup-inner  {
  color: black;
  height: 500px;
  overflow-y: auto;
  overflow-x: hidden;
  position: fixed;
}

HTML：

<div class="popup" data-popup="popup-1">

    <div class="popup-inner">

        <p> content</p>

        <p><a data-popup-close="popup-1" href="#">Close</a></p>
        <a class="popup-close" data-popup-close="popup-1" href="#">x</a>
    </div>
</div>

Answer 1

你尝试过使用z-index吗？

https://www.w3schools.com/cssref/pr_pos_z-index.asp

隐藏在滚动条后面的jQuery模态按钮

1 个答案: