Preserving non-breaking spaces

piotr-kucharski commented 2 years ago

It would be useful if script allowed to preserve  .

lukePeavey commented 2 years ago

Yeah I think that would be a useful feature.

lukePeavey commented 2 years ago

If anyone wants to work on this, please feel free to submit a PR.

wetsoba commented 2 years ago

If you're trying to ensure there is space after each word. You can combine the two to get something close.

// Creates word wraps within the #target
const word = new SplitType('h2', {
  types: 'words',
  tagName: 'span',
  wordClass: 'word-wrap'
});

// Then, creates letter wrap within the word wrap above.
const text = new SplitType('.word-wrap', {
  types: 'chars',
  tagName: 'span',
  charClass: 'letter-wrap',
  absolute: true
});

gsap.from(text.chars, {
  opacity: 0,
  y: 400,
  duration: 2,
  ease: "power4.out",
  stagger: { amount: 2 }
})

Then adjust spacing with css.

lukePeavey / SplitType

Preserving non-breaking spaces #32