选择框应该超出对话框的边缘

Question

我有一个对话框，在这是一个选择框，这应该是对话框的边缘。选择框应该超出底部。到目前为止，我只是管理到底部的选择框消失了。 我使用jQuery Plugin Chosen。

http://jsfiddle.net/Lsjs2/2/

<div id="dialog" title="Basic dialog">
<select id="chosen">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="mercedes">Mercedes</option>
    <option value="VW">VW</option>
    <option value="Nissan">Nissan</option>
    <option value="audi">Audi</option>
</select>

Answer 1

试试这个css：

#dialog {
    overflow : visible;
}

.ui-dialog {
    overflow : visible;
}

View Fiddle Here

- 编辑

Sari Alalem是对的，这会影响其他对话。在不影响其他对话框的情况下，我能想到的解决方案基本上是通过使用JavaScript添加另一个带溢出的类：可见或更改#dialog的父级的css属性（在渲染对话框之后）：

考虑到其他对话框，解决方案应该是

#dialog {
    overflow : visible;
}
$('#dialog').dialog().parent().css('overflow', 'visible');

Updated JSFiddle

Answer 2

溢出设置为隐藏.ui-dialog .ui-dialog-content。用以下内容覆盖它：

.ui-dialog,
#dialog {
  overflow: visible;
}