Preventing Orphans In Text – Adopt-Words

Preview:

Description:

Adopt-Words is a small JavaScript library to prevent orphans in your text by replacing the last space with  .

Fully responsive and works with window resize event.

How to use it:

1. Install and import the Adopt-Words as a module.

# NPM
$ npm install Adopt-Words --save

import AdoptWords from 'adopt-words'

2. Or include the ‘adopt-words.bundle.js’ script on the webpage.

<script src="adopt-words.bundle.js"></script>

3. Attach the function to the text container and done.

<div class="example"><h3>Lorem ipsum dolor sit amet, consectetur.</h3></div>

AdoptWords.init('.example *', {
  // options here
})

4. By default it ignores orphans if there are fewer than 5 words. You can override the limit as follows:

AdoptWords.init('.example *', {
  minWords: 5
})

5. By default it ignores orphans if the last two words are longer than the available space. You can override the limit as follows:

AdoptWords.init('.example *', {
  maxCharacters: 16
})

6. Determine whether to calculate the actual width of the element. Default: false.

AdoptWords.init('.example *', {
  autoWidth: true
})