Question

使用YUI的Dialog小部件，它运行良好，除了大对话框（想想大量内容），页面中出现明显的副作用...页面末尾有很多空白和滚动条。

以下是一个例子：

我所做的就是在developer.yahoo.com/yui/examples/container/dialog-quickstart_clean.html上获取Dialog的原始示例，并添加更多标记（以Lorem Ipsum的形式）。

如果查看代码的设置方式，标记（在＃dialog1中）在页面上完全可见，直到 Yahoo.util.Event.onDomReady触发，并且对话框被实例化在

YAHOO.example.container.dialog1 = new YAHOO.widget.Dialog("dialog1", 
      { width : "30em",
        fixedcenter : true,
        visible : false, 
        constraintoviewport : true,
        buttons : [ { text:"Submit", handler:handleSubmit, isDefault:true },
             { text:"Cancel", handler:handleCancel } ]
      });

此时，持有我所有标记的普通jane <div id="dialog1">被一个容器<div class="yui-panel-container yui-dialog yui-overlay-hidden shadow" id="dialog1_c" style="visibility: hidden; z-index: 2; left: 307px; top: 10px;">包裹。

这很好，除了这个内容仍然是我的布局的一部分，并且滚动条和垂直空间存在。如果我尝试将样式添加到yui-overlay-hidden，如display：none或height：0;溢出：隐藏，我得到奇怪的副作用，如叠加在显示时错误定位。到目前为止，唯一有真正影响的方法是将＃dialog1放在包含高度为0的div中;溢出：隐藏，但在IE7中不起作用（初始化后，页面上仍然存在空白）。

感谢您的帮助，我真的很感激。

Answer 1

我将所有对话框放在一个包含以下css的div中：

div.dialogs{display:none;position:fixed;top:0px;left:80px;

到目前为止工作正常，由于对话框，我不再有滚动条和垂直空间。我包括display:none来隐藏html直到渲染对话框后，一旦渲染它们我将显示更改为“阻止”。如果没有这个，预渲染的html会在一两秒钟内显示，导致页面有点闪烁。

YUI2对话框没有正确隐藏对话框标记

1 个答案: