如何fadeTo()除一个div之外的所有内容？
我正在创建一个教程，并且希望淡出页面上除我希望他们看到的 div 之外的每个 div。我如何使用 fadeTo 来做到这一点？
我目前将其设置为淡化整个身体。我怎样才能将它设置为淡出主体与div id“step2”分开？
代码：
<script type="text/javascript">
$("body").fadeTo("slow", 0.5, function() {
// Animation complete.
});
</script>
I am creating a tutorial and want to fade every div on the page apart from the div I want them to see. How can I do this using fadeTo?
I currently have it set to fade the whole body. How can I set it to fade the body apart from div id "step2"?
Code:
<script type="text/javascript">
$("body").fadeTo("slow", 0.5, function() {
// Animation complete.
});
</script>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（5）
淡入淡出始终会淡化下面的每个元素（包括您使用 jQuery 选择的元素）。除非您想要保持可见的 div 位于 body 的正下方，否则这将很棘手。为了达到您想要的效果，您应该克隆您想要可见的 div，并将其绝对放置在与原始位置相同的位置。这也意味着您需要将隐藏的主要内容放在容器 div 中，因此不要淡化主体，而是淡化容器 div，并将克隆的 div 放在主体正下方的顶层，在容器。
因此，在示例中，您将创建“copy-of-div-i-want”，附加到正文，然后在“content-to-fade”上调用 fadeTo。
这种技术是实现拖放的一种非常常见的方法，因为副本可以轻松有效地绝对定位在屏幕周围。
A fade will always fade every element under and including the one you selected with jQuery. Unless the div you want to stay visible is directly under the body, this will be tricky. To achieve the effect you desire, you should clone the div you want visible, and absolutely position it in the same location as the original. That also means you'll need to put the main content that is getting hidden inside of a container div, so instead of fading the body, fade the container div, and put the cloned div at the top level directly under the body, after the container.
so in the example, you would create "copy-of-div-i-want", append to the body and then call fadeTo on "content-to-fade".
This technique is a pretty common way of implementing drag and drop, because the copy can easily and efficiently be absolutely positioned around the screen.
您可以将 css-selectors 与 JQuery 一起使用:)
You can just use css-selectors with JQuery :)
使用您提供的代码执行您所描述的操作基本上是不可能的，因为所有元素都必须包含在 body 标记内，并且由于
opacity属性继承，一切 页面将变为半透明。哦，覆盖单个div上的opacity属性也不起作用。相反，您需要做的可能是将所有内容移动到另一个
div，然后淡入淡出该 div。使用:not选择器也可能有效，但这不是一个包罗万象的解决方案 - 请注意您的页面结构。It is basically impossible to do what you've described with the code you gave, because all elements have to be contained within the body tag, and since the
opacityproperty inherits, everything on the page will turn half transparent. Oh, and overriding theopacityproperty on that singledivalso won't work.Instead, what you need to do is probably to move everything to another
div, and fade that one instead. Using the:notselector may also work, but it isn't a catchall solution - be aware of your page structure.如果没有看到 HTML，很难判断，但如果
step2是的子级，您可以这样做：尝试一下： < a href="http://jsfiddle.net/SS5Sm/" rel="nofollow noreferrer">http://jsfiddle.net/SS5Sm/
或者
如果嵌套更深，你可以尝试这个。
尽管它对 HTML 结构做出了一些额外的假设。
Hard to tell without seeing your HTML, but if
step2is a child of<body>you could do this:Try it out: http://jsfiddle.net/SS5Sm/
or
If it is more deeply nested, you could try this.
Although it makes some additional assumptions about your HTML structure.
这听起来像是 非选择器 的工作
This sounds like a job for the not selector