jQuery Plugin To Balance The Remaining (Empty) Space In Text - BalanceText
File Size: | 131 KB |
---|---|
Views Total: | 582 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

BalanceText is a lightweight (~4kb minified) jQuery plugin used to balance the remaining (empty) space in each line box of your text for better readability. Similar to the 'text-wrap: balance' property introduced in the CSS Text Module Level 4.
Installing via Package Managerss:
bower install balance-text --save npm install balance-text --save
How to use it:
1. Import the jquery.balancetext.min.js
script into the html page which has jQuery library loaded.
<script src="jquery.min.js"></script> <script src="jquery.balancetext.min.js"></script>
2. Or import it directly via a CDN.
<script src="jquery.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/balance-text/2.0.0/jquery.balancetext.min.js"></script>
3. Add the CSS class 'balance-text' to the text wrapper element.
<p class="balance-text"> Lorem ipsum dolor sit amet. </p>
4. Apply the 'text-wrap: balance' property to the text.
.balance-text { text-wrap: balanced; }
This awesome jQuery plugin is developed by adobe-webplatform. For more Advanced Usages, please check the demo page or visit the official website.