1

所以我有一个用 ul/li 完成的组合框，当你点击一个锚点时它会打开。我的问题是它是模态对话框（jquery-ui）的一部分，而对话框本身只有 2-3 个元素，所以它相当小。我的组合框有大约 12 个元素（它确实是可变的），所以它实际上比模态窗口本身大。

所以现在，当我打开组合框时，它会在对话框中添加一个滚动条。有没有办法让元素有点伸出对话框？

或者关于如何使这个对话框更直观一点的建议？:)

这是html：

<div id="select">
<a id="combo">combo</a>
<div id="combul_div">
<ul id="comboul">
    <li>a</li>
    <li>b</li>
    <li>c</li>
    <li>d</li>
</ul>
</div>
</div>
<a id="click">Click</a>

这是我使用的js

$('#click').click(function () {
$('#select').dialog({ 
    modal: true,
    resizable: false,
    position: 'center'
 });
});

$('#combo').click(function() {
    $('#comboul').toggle();   
})

这是我正在使用的CSS：

#select {
 display: none;
}
#combo {
    width: 100px;
}
#comboul_div{
    width: 100px;
}
#comboul {
    display: none;
    position: absolute;
    width: 100px;
    border: 1px solid grey;
}

这是一个精简版的 jsfiddle：http: //jsfiddle.net/cspHy/7/

4

1 回答 1

0

@biziclop 提供了正确的解决方案。

只是在这里给出一个答案，

CSS

.ui-dialog, .ui-dialog .ui-dialog-content {
    overflow: visible !important;
}

#select {
 display: none;
}
#combo {
    width: 100px;
}
#comboul_div{
    width: 100px;
}
#comboul {
    display: none;
    position:absolute;
    width: 100px;
    border: 1px solid grey;
}

#comboul可以绝对定位或可以制作float :left

于 2013-09-30T02:11:40.680 回答