Question

请帮我解决这个问题。

这是我的网页。

<div id="wrapper">

   <div id="header">
      header text
   </div>

   <div id="content">
      content text
   </div>

</div>

我想淡入#content块。

当我使用 $("#wrapper").fadeIn(1500);时，它工作正常并且在整个页面中消失但是当我使用 $("#content").fadeIn(1500);时，它永远不会起作用，在衰落方面没有任何事情发生。

我做错了什么？

我也试过了 $("#wrapper #content").fadeIn(1500);，但没有运气，你能告诉我如何定位#content div吗？

谢谢堆

Answer 1

如果没有看到示例页面/代码，很难肯定地说，但听起来你已经隐藏#wrapper而不是#content。

因此，当您淡入#wrapper（因此显示所有包含的内容）时它会起作用但是当您淡入#content时它不起作用，因为它的父级（#wrapper）是仍然隐藏着。

您可能希望将#wrapper更改为默认显示，#content隐藏，以便淡入显示正确。

同样，这只是猜测。如果您添加链接/样本，我们可以给出更好的答案。

Answer 2

这对我有用。请参阅此处的示例：http://jsfiddle.net/xwqPA/

Answer 3

默认情况下将内容div设置为display: none：

<div id="wrapper">
  <div id="header">
    header text
  </div>
  <div id="content" style="display: none;">
    content text
  </div>
</div>

Answer 4

选择两个jQuery元素时，请用逗号分隔：

$（“＃wrapper，＃content”）。fadeIn（1500）;

请参阅multiple selectors

编辑：由于这是低调的，我觉得有必要进一步澄清......你说#wrapper的消失本身就有效。从那以后，我可以假设#wrapper默认是隐藏的。因此，如果您打算“显示”＃wrapper的子元素中的任何一个，您将需要淡入它（或至少将其显示属性设置为使用show()'阻止'），然后才能尝试淡入＃内容。这可以通过在上面显示的包装器和内容div上执行淡入淡出来完成。

Jquery淡入div中的div

4 个答案: