Question

这是一个使用TimelineMax的gsap函数，现在如果我尝试将对象传递给它，它说它为空

function fadeInText(l) {
  var el = document.querySelector(l);
  var split = el.dataset.split;
  var text = new SplitText(el, {
    type: split
  });
  var tl = new TimelineMax({
    paused: false
  });
  var splitEls = text[split];
  var wrapEls = function wrapEls(els) {
    return els.map(function(el) {
      return '<span style="display: inline-block">' + el.innerText + '</span>';

    });
  };
  var wrapped = wrapEls(splitEls);
  splitEls.forEach(function(el, i) {
    el.style.overflow = 'hidden';
    el.innerHTML = wrapped[i];
  });
  var masks = splitEls.map(function(el) {
    return el.querySelector('span');
  });
  tl.staggerFrom(masks, 1.25, {
    skewY: 4,
    y: '200%',
    ease: Expo.easeOut,
    delay: 0.5
  }, 0.1, 'in');
  return l;
}

我为解决此问题所做的事情是，我遍历了所有带有“ split”类的元素，并向其添加了一个“ split” +升序编号的类，但这有点脏，似乎在某些情况下会出错。另外，我尝试更改

var el = document.querySelector(l)

到

var el = l

并将obj传递给它，但随后它说el.dataset不是函数。典型元素看起来像这样

<h2 class="split" data-split="lines">Some text</h2>

如何更改此函数以接受对象而不是类？

0 个答案: