如何淡入（）除一个div以外的所有东西？

我正在创建一个教程，希望淡入淡出网页上的每个div，除了我希望他们看到的div。我怎样才能做到这一点使用fadeTo？如何淡入（）除一个div以外的所有东西？

我目前已设置淡入淡出整个身体。我如何将它设置为从div id“step2”中淡出身体？

代码：

<script type="text/javascript"> 
    $("body").fadeTo("slow", 0.5, function() { 
     // Animation complete. 
    }); 
</script>

来源

2010-08-13 user342391

很难说没有看到你的HTML，但如果step2是<body>一个孩子，你可以这样做：

试试看：http://jsfiddle.net/SS5Sm/

$("body").children(':not(#step2)').fadeTo("slow", 0.5, function() { 
    // Animation complete. 
});

或

$("body > :not(#step2)").fadeTo("slow", 0.5, function() { 
    // Animation complete. 
});

如果它更深层嵌套，你可以试试这个。

$("body > :not(:has(#step2))").fadeTo("slow", 0.5, function() { 
    // Animation complete. 
});

尽管它对您的HTML结构做了一些额外的假设。

来源

2010-08-13 13:35:29 user113716

你可以使用CSS选择器jQuery的:)

$("*:not(div#step2)").fadeTo(...)

来源

2010-08-13 13:35:58 elslooo

**永远不会使用通用选择器（*）。永远不会！** – jAndy 2010-08-13 13:37:40

这会单独为每个元素排队淡出动画，可能会立即导致IE崩溃:) – 2010-08-13 13:37:42

使用'“body：not（div＃step2）”'而不是'“*：not（div＃step2）”'only only跳过两个迭代（'html'和'body'），因为'“：not（...）”'只是'“*：not（...）”'的简写。因此，使它与所提供的解决方案一样快（或慢）（假设'div＃step2'可能不是'body'的直接子节点）。在任何情况下，我认为你不应该首先使用'：not（...）'选择器，因为它总是意味着你忘记了你的元素，并试图通过使用css选择器来解决这个问题真的意味着生产用途。 – elslooo 2013-04-18 17:58:38

这听起来像是为not selector

来源

2010-08-13 13:36:56 Jimmy

淡入淡出将始终在褪色的每一个元素一份工作，包括你使用jQuery选择的一个。除非你想保持可见的div直接位于身体下方，否则这将是棘手的。为了达到你想要的效果，你应该克隆你想要看到的div，并且绝对将它放在与原始位置相同的位置。这也意味着您需要将隐藏在容器div内的主要内容放在容器div中，所以不要淡化正文，而要淡化容器div，并将克隆的div直接置于主体下的顶层容器。

<body> 
    <div id="content-to-fade"> 
     ...<div id="div-i-want-">...</div> 
    </div> 
    <div id="copy-of-div-i-want">...</div> 
</body>

因此在本例中，您将创建“复制的-DIV-我想做”，附加到身体，然后调用fadeTo的“内容到变脸”。

这种技术是实现拖放的一种非常常见的方式，因为副本可以轻松高效地完全定位在屏幕周围。

来源

2010-08-13 13:37:32

这基本上是不可能做你与你给的代码说明什么，因为所有的元素都被包含在body标签中，而且由于opacity财产继承，一切页面上会变成半透明。哦，并且覆盖opacity属性，那个单独的div也不起作用。

相反，您需要做的事情可能是将所有内容移动到另一个div，并淡化那个。使用:not选择器也可以工作，但它不是一个全面的解决方案 - 请注意您的页面结构。

来源

2010-08-13 13:43:23

如何淡入（）除一个div以外的所有东西？

回答

相关问题