jquery - Simplemodal 滚动条和关闭图像问题

Question

我有一个简单模式的 jquery 弹出窗口，它必须将溢出设置为自动，因为结果列表可能很长。滚动条显示正常，但关闭图像被推到垂直滚动条和简单模式边框后面。如果我注释掉

overflow: 'auto',

关闭图像在边框顶部显示良好。我已经尝试将图像的 z-index 设置得非常高，但什么也没做。它还会显示水平滚动条，因为关闭的图像位于垂直滚动条的后面。

我的jquery代码是

jQuery('#CustLookupResults').modal({
                        containerCss: {
                            padding: 0,
                            overflow: 'auto',
                            maxHeight: 800

                        },
                        onShow: function (dlg) {
                            $(dlg.container).css('width', 650);
                            $(dlg.container).css('height', 'auto');
                        },
                        overlayClose: true,
                        opacity: 75
                    });

我的CSS是

#simplemodal-container
{
    border:8px solid;
    padding: 12px;
    border-color:Black;
    border-style:outset;
    background-color:White;
    color:Black;
    vertical-align:middle;
    text-align:center;
}

#simplemodal-container a.modalCloseImg {
    background:url(../images/x.png) no-repeat; /* adjust url as required*/
    width:25px;
    height:29px;
    display:inline;
    z-index:3200;
    position:absolute;
    top:-15px;
    right:-18px;
    cursor:pointer;
}

如能提供有关如何解决此问题的任何帮助，我们将不胜感激。

Answer 1

如果您的数据扩展了容器，SimpleModal 应该会自动将 overflow:'auto' 添加到 simplemodal-wrap div。如果由于某种原因不是(由于您使用它的方式)，您可以执行以下操作:

jQuery('#CustLookupResults').modal({
    containerCss: {
        padding: 0,
        width: 650,
    },
    maxHeight: 800,
    onShow: function (dlg) {
        $(dlg.container).css('height', 'auto');
        $(dlg.wrap).css('overflow', 'auto'); // or try jQuery.modal.update();
    },
    overlayClose: true,
    opacity: 75
});