jquery - 在固定页眉上显示底部阴影，在固定页脚上显示顶部阴影，仅在滚动时可见

Question

我已经研究了一种解决方案，该解决方案非常适用于仅在滚动时显示带有过渡的阴影的固定标题。

有没有办法通过更改 CSS 和 JQuery 来插入类似的固定页脚？另一个要求是，当您中途停止滚动时，是否还有一种方法可以停止阴影和过渡？

这是该 JSFIDDLE 页面的链接，并且使用了该脚本。

$(function(){

$(window).on('scroll', function(){

    var opacity = $(document).scrollTop();
    opacity = (opacity > 100 ? 100 : opacity) / 100;

    $('#fixedtop').css('box-shadow', '0 5px 15px rgba(188, 0, 80, ' + opacity + ')');
});

});