模态框溢出

时间:2014-08-20 12:26:55

标签: html css scroll modal-dialog

我得到了包含列表内容的模态框。但是这个名单比预期的要长。我不认为延长模态框的时间。我怎么能让它可滚动。或拆分模态,使其在另一个框中显示。列表自动从xml

更新
<div id="div1" 
style="width:600px;height:480px; display:none;background-color:#7cd350; border-radius: 10px; z-index: -999; position:absolute; z-index:1;" >
<button style="background:none; border:none; float:right;" id="button3">
<img src="images/btn_close_diction0001.png"/>
</button> 
<script>
xmlDoc=loadXMLDoc("dataMain.xml");
document.write("<div style='padding-top:50px;padding-left:20px;font-color:#111;'>");
x=xmlDoc.getElementsByTagName('menu');
for (i=0;i<x.length;i++)
{
document.write("<li class='duudah'>");
document.write("<a href='huudas");
document.write(i);
document.write(".html' style='padding:30 25px;'>");
document.write(x[i].getAttribute('id'));
document.write(":");
document.write("    ");
document.write(x[i].getAttribute('name'));
document.write("</a>");
document.write("</li>");
document.write("<br>");
} 
document.write("</div>");
</script>
        </div>




   .modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  display: none;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  outline: 0;
}
.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}

1 个答案:

答案 0 :(得分:0)

不确定我是否理解你,但只是改变

overflow: auto;

而不是隐藏在.modal类中。另外,您可能希望为div添加宽度和高度。