element.style.transform = translate()onScroll - 不起作用

时间:2016-11-03 20:28:08

标签: javascript html dom transform translate

我正在尝试为单个字母创建一个动作,我做了一个名为 generateText 的函数,它创建了<h2> .letters 类的排列。

稍后我想单独选择这些字母并使用scrollY进行翻译。由于某些原因,这不起作用。

DeveloperTool / Elements向我显示样式更改为

 style="transform: translate(32px, 0px);"

无论如何,元素都不会移动。

有人知道为什么吗?

   function generateText(string){
      var text = t("#appearOne");
      var arr = string.split("");

      for(i=0; i<arr.length; i++){
      text.innerHTML += "<h2 class="+ " letter " +">"+arr[i]+"</h2>";
    }
    }    
    function moveText(id){
      window.onscroll = ()=>{
        var arr = document.querySelectorAll(".letter");
            for(i=0; i<arr.length;i++){
              arr[i].style = "transform:translate(0px ,"+scrollY/8+"px)"
            }
      }
}

0 个答案:

没有答案