视差背景未正确平铺

Question

我正在尝试对一个小div进行简单的视差滚动效果，但是当你向下滚动时，你可以看到背景重复的行。 您可以在此处查看效果：https://jsfiddle.net/c1vr6nrk/1/embedded/result/

我尝试编辑以下代码，但似乎无法使其正常工作：

(function(){

  var parallax = document.querySelectorAll(".parallax"),
      speed = 0.5;

  window.onscroll = function(){
    [].slice.call(parallax).forEach(function(el,i){

      var windowYOffset = window.pageYOffset,
          elBackgrounPos = "50% " + (windowYOffset * speed) + "px";

      el.style.backgroundPosition = elBackgrounPos;

    });
  };

})();