我想要一个看起来像这样的对话框:
我认为这种方法可行,但我想我错了:
JavaScript
//Creates The Dialog
$('.ImageDialogDiv').dialog({
position: [98, 223],
resizable: false,
//modal: true, /* UNCOMMENT AFTER DEBUGGING */
closeOnEscape: false,
class: 'OverwriteDialogOverflow',
title: $('#hiddenDialogElements').html(),
open: function (event, ui) { $(".ui-dialog-titlebar-close").hide(); }
});
CSS
/*
* Overrides hidden overflow
*/
.OverwriteDialogOverflow
{
overflow: visible;
}
HTML
<div id = "dialogDiv" class = "ImageDialogDiv"></div>
<div id = "hiddenDialogElements">
<button id = "hiddencloseButton">Close</button>
<div id = "hiddenArrowButtons">
<button class = "ArrowButtonDialogLeft" onclick = "ShowNextImage(-1)" ></button>
<button class = "ArrowButtonDialogRight" onclick = "ShowNextImage(1)" ></button>
</div>
</div>
当我尝试将箭头或关闭按钮移出对话框时,会被切断并且不可见。我虽然添加.OverwriteDialogOverflow
会解决这个问题。
建议?