css - 向下滚动时通过 CSS3 将样式应用于固定的 div

标签 css

如果你去this website您会看到,当您向下滚动时,会通过 javascript 为顶部导航 div 添加以下样式 (#yucsHead):

-webkit-box-shadow: 0 0 9px 0 rgba(73,15,118,1)!important;
-moz-box-shadow: 0 0 9px 0 rgba(73,15,118,1)!important;
box-shadow: 0 0 9px 0 rgba(73,15,118,1)!important;
border-bottom: 1px solid #490f76!important;

我对 CSS3 有点陌生,我注意到 CSS 现在有许多以前只能在 Javascript 中实现的功能。因此我想知道这是否也可以通过 CSS3 实现。我更喜欢尽可能通过 css 做事。

最佳答案

为了找到文档滚动了多少,我们在 jquery 中使用了 scrollTop(),并基于应用的样式。您的示例网站就是这样做的……我认为没有纯 CSS 3 的解决方案。

关于css - 向下滚动时通过 CSS3 将样式应用于固定的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18571222/

相关文章:

CSS3 箭头超链接

asp.net - 如何使用 C# 在 asp.net 中的代码隐藏文件中生成的 html 上应用 CSS

javascript - 检测 iOS-WebApp 并更改 CSS 属性

html - 表格列,使用 css 设置最小和最大宽度

html - 防止 div 换行到下一行

html - css计数器重置: not working in firefox?

css - Bootstrap Intellisense 缺少 Visual Studio 2015

javascript - 来自 Angular 落的 CSS 覆盖

html - fiddley navigation - 无序列表和背景颜色中的无序列表

chrome 和 IE 的 css 问题