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

我已经找到了一个解决方案，它可以很好地用于固定标题，只在滚动条上显示阴影和过渡

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

是指向使用此脚本的JSFIDLE页面的链接

$(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 + ')');
});

});