Jquery淡入一个div内的一个div答案

【问题标题】：Jquery Fade in for a div within a divJquery淡入一个div内的一个div
【发布时间】：2012-07-08 10:07:51
【问题描述】：

请帮助我。

这是我的网页。

<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吗？

谢谢大家

【问题讨论】：

标签： jquery html web

【解决方案1】：

如果没有看到示例页面/代码，很难确定，但听起来您隐藏了 #wrapper 而不是 #content。

因此，当您淡入 #wrapper（从而显示所有包含的内容）时它可以工作，但当您淡入 #content 时它不起作用，因为它的父级 (#wrapper) 仍然隐藏。

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

同样，这一切都只是在这一点上的猜想。如果您添加链接/示例，那么我们也许可以给出更好的答案。

【讨论】：

【解决方案2】：

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

【讨论】：

谢谢。我按照我想要的方式更新了它。这就是我所追求的。谢谢各位。 jsfiddle.net/xwqPA/1
嗨康纳，刚刚发现这在 ie8 上不起作用。可能是什么问题？

【解决方案3】：

默认设置内容div为display: none：

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

【讨论】：

@user1074803 欢迎您。我不知道为什么有人对我投了反对票。也许答案太短了。
谢谢@ahren 下次我想在一个句子中突出显示一些代码时我会尝试“ctrl + K”:-)
不用担心@HighKickX，您也可以使用 ` 字符 - 它（在美国布局的键盘上）就在 esc 键的下方。

【解决方案4】：

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

$("#wrapper, #content").fadeIn(1500);

见multiple selectors

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

【讨论】：