如果CSS距页面顶部超过130像素，则会显示阴影

Question

如何仅使用CSS做下一个javascript函数？ 如果距页面顶部超过130像素，则需要显示框阴影。

$(window).scroll(function() {
    if ($(this).scrollTop() <= 130) {
        $('.shadow').css({
                'box-shadow': 'none',
                '-moz-box-shadow' : 'none',
                '-webkit-box-shadow' : 'none' });
    }
    else {
        $('.shadow').css({
                'box-shadow': '0px 10px 10px #d0d0d0',
                '-moz-box-shadow' : '0px 10px 10px #d0d0d0',
                '-webkit-box-shadow' : '0px 10px 10px #d0d0d0' });
    }    
});

对于工作应用程序，我真的只需要在CSS中执行此操作。非常感谢！

Answer 1

  window.onscroll = function() {scrollFunction()};

    function scrollFunction() {
      if (document.body.scrollTop > 130  || document.documentElement.scrollTop > 130 ) {
        document.getElementById("myBtnd").classList.add("showbox");
      } else {
        document.getElementById("myBtnd").classList.remove("showbox");
      }
    }

css

.showbox{

 box-shadow: 5px 10px 8px 10px #888888;
}