2011-02-17 76 views
0

我有一個簡單的jquery彈出窗口,必須將溢出設置爲auto,因爲結果列表可能很長。滾動條顯示正常,但近距離圖像被推到垂直滾動條和簡單模式邊界後面。如果我註釋掉Simplemodal Scroll Bar and Close Image問題

overflow: 'auto', 

行關閉圖像顯示在邊界的頂部罰款。我試圖設置圖像的Z指數非常高,並沒有做任何事情。它還會顯示水平滾動條,因爲緊密圖像位於垂直滾動條的後面。

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

關於如何解決此問題的任何幫助將不勝感激。

回答

3

如果您的數據擴展容器,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 
}); 
+0

非常感謝。 jquery.modal.update工作,圖像顯示在酒吧和邊框的頂部,滾動條也起作用。它看起來好多了。 – nickmoriarty 2011-02-18 19:40:00