Simplemodal滚动条和关闭图像问题

问题描述

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

I have a simplemodal jquery popup that has to have overflow set to auto because the resulting list can be long. The scroll bars show up fine, but the close image gets shoved behind the vertical scroll bars and the simplemodal border. If I comment out the

overflow: 'auto',

行，关闭图像在边框顶部显示得很好.我尝试将图像的Z-index设置得很高，但没有执行任何操作.由于关闭的图像在垂直滚动条的后面，因此也会显示水平滚动条.

line the close image shows up fine over the top of the border. I have tried setting the z-index for the image really high and that did nothing. It also makes horizontal scroll bars show up because the close image is behind the vertical scroll bars.

我的jquery代码是

My jquery code is

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;
}

对于解决此问题的任何帮助，将不胜感激.

Any help on how to fix this would be appreciated.

推荐答案

SimpleModal应该自动将overflow:'auto'添加到simplemodal-wrap div中.如果由于某种原因而不是(由于您的使用方式)，则可以执行以下操作:

SimpleModal should be automatically adding overflow:'auto' to the simplemodal-wrap div if your data extends the container. If for some reason it is not (due to how you are using it), you could do something like:

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
});

这篇关于Simplemodal滚动条和关闭图像问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！