滚动时在图像上添加模糊

Question

我正在尝试逐渐添加过滤器：向下滚动页面时模糊（0px）。

因此，当您滚动图像模糊时，px会上升。需要逐步做到这一点，但不知道如何通过jquery实现它。有什么帮助吗？

到目前为止我所拥有的是：

$(window).scroll(function() {

      var scrollTop = $(window).scrollTop();
      var divam = 5;
          $(".ftimg").css({
              "background-position":"0px -"+scrollTop/divam+"px"     
          });

    });

这会编辑背景位置然而，我不知道如何模糊模糊。像这样的东西不起作用：

$(window).scroll(function() {

      var scrollTop = $(window).scrollTop();
      var divam = 5;
          $(".ftimg").css({
              "filter":"blur: -"+scrollTop/divam+"px"     
          });

    });

Answer 1

我设法自己解决了这个问题：

$(window).scroll(function() {

          var scrollTop = $(window).scrollTop();
          var divam = 90;
          var blurstr = "blur("+scrollTop/divam+"px)";
              $(".cover-pic").css({
                  "-webkit-filter": blurstr,
                    "filter": blurstr   
              });

        });