Jquery 是否可能有一个元素'；不透明度将其他元素带入背景；像窗户吗？

我想象着有一个固定位置的盒子，从背景的页面底部开始。它们的不透明度设置为.8，它们将固定在页面底部，直到它们被滚动到页面下方的白色背景上。即使他们正在通过这个新的白色背景，我仍然希望看到原始背景通过框，因为他们在白色滚动。这可能吗？

[对于非固定非缩放背景图像]

如果我理解正确的话，你想要的效果基本上是框通过白色框显示视图并显示页面背景。虽然这实际上不能用css来完成，但可以用javascript来模拟

基本思想是将框的背景设置为与页面相同的背景，然后调整其背景位置以匹配其在页面上的位置

$（函数（）{
$（窗口）。滚动（函数（）{
$（“.box”）。每个（函数（）{
var$this=$（this）；
var pos=$this.offset（）；
$this.css（“背景位置”，（位置左*-1）+“px”+（位置上*-1）+“px”）；
});
}).scroll（）；
});
正文{
背景：url(http://placekitten.com/1000/3000);
保证金：0；
填充：0；
}
.盒子{
边框：3倍纯色灰色；
宽度：100px；
高度：100px；
位置：固定；
背景：url(http://placekitten.com/1000/3000);
}
.内容框{
边缘顶部：300px；
背景色：白色；
高度：300px；
}
我在这里添加一个单独的答案，因为我相信第一个答案可能对其他人有用，所以我不想删除它。然而，在评论中，问题的要求得到了进一步完善

[对于固定背景]

由于身体背景的背景位置是固定的，所以实际上要简单得多。您可以简单地添加一个与主体具有相同背景属性的内部div。纯css，无需js。它甚至可以根据窗口大小进行背景缩放



body.bg{
背景：url（'http://www.junoon.co/sw-store/images/wallpapers/urdu.co-34163121.jpg'）没有固定的重复中心；
-webkit背景尺寸：封面；
-moz背景尺寸：封面；
-o-背景尺寸：封面；
背景尺寸：封面；
溢出x：隐藏；
}
朗博克斯先生{
高度：100vh；
边际上限：100vh；
背景色：#FFFFFF；
文本对齐：居中；
背景大小：100%；
右边距：-3000px；
右侧填充：3000px；
左边距：-3000px；
左侧填充：3000px；
}
#属性按钮{
底部：10px；
边框左下半径：10px；
边框右下半径：10px；
边框右上角半径：10px；
边框左上半径：10px；
背景大小：100%；
位置：固定；
}
.按钮{
边框：3倍纯色灰色；
高度：35vh；
宽度：35vh；
位置：固定；
溢出：隐藏；
}
.bg{
身高：100%；
宽度：100%；
}

您是否研究过不透明度属性或使用RGBA作为CSS中的背景色？这是可能的，但会涉及到很多技巧。仅仅在CSS中是不可能的。你还需要使用javascript。@Cooperista我还没有深入讨论，但现在你这么说了，我会的。我不认为仅仅使用CSS是可能的。@Anubhav你能给我一个大概的过程，我需要用它来实现这一点吗？或者至少可以通过谷歌找到它？我什么都没想到。听起来像是禅宗花园的结束-这是纯CSS，没有javascript。”…然后调整他们的背景位置以匹配他们在页面上的位置”-这不是CSS所做的吗？我需要进一步研究一下，看看是否有办法解决这个问题，但它似乎并没有在固定元素的滚动上更新：我想我已经开始更好地理解需求了。。。也许“通过滚动层的明显的洞”会描述它？这正是我要找的！我在自己的项目中进行了尝试，但没有达到预期效果。我不知道为什么jsfiddle上的图片没有滚动，但在我的站点上，它看起来像我的jsfiddle示例，但它在用户滚动上的重复背景中滚动。检查一下：另外，如果我只想有一个标准定位的盒子仍然有这种效果，我需要做什么？谢谢你的耐心。我想我的评论是一个不同的问题，但由于它们是如此密切相关，我认为将两者显示在同一页上是合适的。这个答案完美无瑕，但当我对其应用规范时，另一个答案却不完美。我会自己摆弄它，因为打破它的显然是我自己的错误。谢谢你抽出时间！干杯