半透明标题在滚动时变得不透明答案

【问题标题】：Semi-transparent header becomes opaque on scroll半透明标题在滚动时变得不透明
【发布时间】：2015-08-26 05:35:46
【问题描述】：

我正在尝试以 50% 的不透明度显示 5我网站的标题（标题和导航将与它后面的幻灯片重叠）。当用户向下滚动页面时，我希望标题区域保持锁定在网页顶部并删除不透明度。我找到了一个可以修改的示例。它适用于除 IE 之外的所有浏览器。有人知道 IE 的解决方法吗？

window.addEventListener('scroll', function () {
 document.body.classList[
  window.scrollY > 20 ? 'add': 'remove'
 ]('scrolled');
});

干杯！

【问题讨论】：

我们说的是哪个版本的 IE？支持 CSS3 不透明度功能可能是个问题 - 查看这篇文章了解跨浏览器不透明度：css-tricks.com/snippets/css/cross-browser-opacity
另外我建议你将过渡规则放在#header中以获得更平滑的效果
Internet Explorer 11

【解决方案1】：

在IE中你需要使用：

 **window.document.documentElement.scrollTop** instead of **window.scrollY**.

【讨论】：