Css 当粘性元素到达粘性位置时，更改其外观

我已经创建了一个底部div，它在滚动站点时始终存在。它的“自然”停止在页脚后面。当我滚动时，它不在页脚，有点透明。然而，我想做的是当粘性div到达底部（即它的“真实”位置）时，背景会发生变化或类似的事情

如果不使用JS或类似的东西，这是可能的吗

用小提琴更新：

HTML:

---

因此，正如你在小提琴中看到的，在滚动时，粘滞物有轻微的不透明度，但当我到达底部时，它应该是这样的，我希望它将不透明度变成

1.0

或类似的东西，就像在鼠标悬停时一样。

你可以对容器应用不透明背景来模拟这一点。当粘性元素到达底部时，背景将隐藏透明度：

.largeDiv{
高度：1500px；
宽度：100%；
背景:#中交;；
}
.集装箱{
背景：rgba（0,0255,1）；
}
stickyDiv先生{
位置：粘性；
底部：0px；
文本对齐：居中；
背景：rgba（0,0255,0.5）；
颜色：白色；
填充：25px；
}
.stickyDiv:悬停{
背景：rgba（0,0255,1）；
}

试验

共享您的代码。这是可能的（相关：）对不起，我已经尝试创建一个例子了。

<div class="largeDiv"></div>
<div class="stickyDiv">Test</div>

.largeDiv {
  height: 1500px;
  width: 100%;
  background: #cccccc;

}

.stickyDiv {
  position: sticky;
  bottom: 0px;
  text-align: center;
  background: blue;
  color: white;
  opacity: 0.8;
  padding: 25px;
}

.stickyDiv:hover {
  opacity: 1.0;
}