向下滚动淡出div（与滚动相关）

Question

我有一个100％高度和宽度的介绍屏幕。

我想以1的不透明度开始，当用户向下滚动时，不透明度通常会降低，直到div的底部距离顶部大约100px - 这是不透明度应该达到0。

有什么建议吗？一直在寻找解决方案而没有找到任何东西。

你能在CSS3中做到这一点吗？

这是我的HTML＆amp; CSS到目前为止

HTML

<div class="outer" id="welcome">
<div class="inner">
<p>Hi Hello Hi Hello Hi Hello</p>
</div>
</div>

<div class="content">
</div>

CSS

.outer {
    display:table;
    height:100%;
    width:100%;
}

.inner {
    display:table-cell;
    vertical-align:middle;
    text-align:center;
}

.content {
height:1000px;
background-color:pink;
}

Answer 1

This可能就是您所需要的。使用Jquery。