Question

正如标题所说，这里的内容基本上是：

<div id='container' style='display:block; position:absolute; width:auto; height:533px;overflow:hidden;white-space:nowrap;'>
  </div>

在用户交互时 - 我做了一些工作：请求一些JSON，构建元素，然后将所述元素追加到“容器”div。结果如下：

<div id='container' style='display:block; position:absolute; width:auto; height:533px;overflow:hidden;'>
   <img src="A REAL, VALID URL" border='0'/>
   <img src="A REAL, VALID URL" border='0'/>
   <img src="A REAL, VALID URL" border='0'/>
   <img src="A REAL, VALID URL" border='0'/>
   <img src="A REAL, VALID URL" border='0'/>
 </div>

现在这里发生了什么。如果将子项附加到此并且它们超过了父项的高度。父母消失了。

我追求的是“hasLayout”和所有爵士乐 - 没有任何作用。

如果孩子的体型相同或更小，是什么工作？但由于我想要完成的性质，这是不可取的 - 也不能保证他们会小一点

height:auto不起作用，但设置值大于最大的孩子会修复此问题 - 但会扭曲我的布局

提前致谢。

编辑：图像通过JSON和延迟队列的组合加载。保证在将它们附加到容器元素之前加载它们。

基本上：

var img = new Image(); img.onload = function () { theContainer.appendChild(this);}; img.src = someURL;

在所有chrome和FF
中都能正常工作
edit2：我试图将图像附加到“容器”对象之前和之后将其附加到主体上。两者都不会产生预期的结果。

编辑3：* IE7和IE9的行为不如上所述。这是IE 8 *
独有的

Answer 1

我以前见过这个，但我不记得我是怎么解决的。您可能会尝试在容器中放入另一个div并将图像附加到该div中，包装器div通常会解决IE问题。

Answer 2

所以问题是“hasLayout”IE 8错误。通过将容器div的宽度设置为“除auto之外的其他东西” - 它现在可见并且按预期工作/显示。

欢乐时光，感谢大家的帮助。

当附加较大的孩子时，IE 8 Div消失

2 个答案: