jQuery Plugin To Balance The Remaining (Empty) Space In Text - BalanceText
| File Size: | 131 KB |
|---|---|
| Views Total: | 615 |
| 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.





