JQuery FadeIn-背景图像div中的淡入淡出，而不是内容div？

我花了很长时间想弄明白怎么做：

有关该问题的实际示例，请参见

我希望使用JQuery淡入

（主要内容后面包含垂直线灰色背景），但不淡入

中包含的内容前面的内容

现在，我似乎只能让它淡入所有内容，而我只希望背景div淡入

任何人谁可以透露一些解决方案，并帮助我出来，将不胜感激

干杯

已解决

我将div的z索引调整为−1和绝对定位。就这么简单：

z-index:-1;
position:absolute;

---

由于

#content

是

#home#page_back

的子项，因此父项中的淡入自然会淡入所有子项。考虑提取<>代码> HOME页> <代码> div，并将其作为<代码>内容> <代码>的兄弟姐妹。您仍然可以通过CSS获得所需的维度。

您只有两个选择：
1-将

内容

div放在

主页(返回)之外

2-使用css3规则：

背景色：rgba（255,0,0,1）用于
内容
div

顺便说一句，这是一个纯css问题而不是jquery问题，任何透明元素都会使其所有子元素都是相同的透明元素

CSS3解决了这个问题，它使用了，你可以用它的最后一个值来控制不透明度，它不会影响内部元素

您可以围绕这些双向优先搜索结果检查许多解决方案

Twitter正在使用这个CSS3

更新：

很明显，jquery不支持RGBA，因此您可能需要一个用于此目的的类，或者只需在css中创建一个类并将其交给该父元素。
我认为类似的方法应该可以工作：

$(document).ready(function () {
$("#home_page_back").hide();
$("#content").fadeTo(0, 0);
$("#home_page_back").fadeIn(500, function(){
    $("#content").fadeTo(500, 1);
    });     
});

您还可以使用
$（“#content”）.hide（）
，但是像这样，当你需要显示
#内容时，你可能会得到更平滑的淡入淡出效果？查看OP中的网址，看看发生了什么。请告诉我，我已经尝试过编写一段新代码，但我不确定这是否是您想要的？。克里斯托弗，我肯定更愿意使用您的方法，因为这似乎是最简单的方法，而不是必须重新组织CSS中的所有内容，但它似乎对我不起作用。当我用hide（）替换css（'opacity'，'0'）时，它只是完全隐藏了所有内容和背景。如果你有其他的解决方案，我很乐意尝试！！啊，对不起，我没有看到你编辑了原始代码。刚刚尝试过-它看起来比以前好多了，但我真的想让内容div不褪色，立即出现-然后让主页后退div在behindOkay中褪色，在这种情况下，我没有真正的解决方案，因为内容div是主页后退的一部分，当主页后退被隐藏时它不可见。。。不过，你可能想寻找一种在背景图像中淡入淡出的解决方案，比如在这篇文章中：或者这样：我尝试使用solution#2，但它没有改变淡入淡入淡出的内容。我猜您已经发现RGBA不适用于JQuery。哦，好吧，我试着很快就完成了，但似乎仍然没有奇怪的效果。我把#主页#作为#内容的子页面放回#主页#，但它仍然使内容和子页面褪色（并使背景变小..当然可以通过CSS进行更改）