Description
A jQuery plugin to set font sizes responsively based on its' container width. Use jQuery responsiveText to have scalable headlines, build responsive tables and more!
View the demo at [http://garyhepting.com/jquery-responsive-text]
jquery-responsive-text alternatives and similar libraries
Based on the "Typography" category
-
Lettering.js
A lightweight, easy to use Javascript <span> injector for radical Web Typography -
FlowType.JS
Web typography at its finest: font-size and line-height based on element width. -
slabText
A jQuery plugin for producing big, bold & responsive headlines -
simple-text-rotator
Add a super simple rotating text to your website with little to no markup -
BigText
jQuery plugin, calculates the font-size and word-spacing needed to match a line of text to a specific width. -
circletype
A jQuery plugin that lets you curve type on the web
* Code Quality Rankings and insights are calculated and provided by Lumnify.
They vary from L1 to L5 with "L5" being the highest. Visit our partner's website for more details.
Do you think we are missing an alternative of jquery-responsive-text or a related project?
README
jQuery responsiveText
A jQuery plugin to set font sizes responsively based on its' container width. Use jQuery responsiveText to have scalable headlines, build responsive tables and more!
View the demo at [http://garyhepting.com/jquery-responsive-text]
Installation:
Initialize the plugin:
<script type="text/javascript">
$(document).ready(function() {
$('.responsive').responsiveText();
});
</script>
Configurations can be added to the markup of each element with simple data attributes:
<h1 class="responsive" data-compression="8" data-min="20" data-max="60">Responsive Text</h1>
or
<p class="responsive" data-compression="25" data-min="14" data-max="40">A jQuery plugin to set font sizes responsively based on its' container width. Use responsiveText.js to have scalable headlines, build <a href="https://github.com/ghepting/jquery-responsive-tables">responsive tables</a> and more!</p>
Scrollable Text:
<h1 class="responsive" data-scrollable="1" data-min="20" data-max="60">Scrollable Responsive Text</h1>
Complete Options:
<h1 class="responsive" data-compression="8" data-scrollable="1" data-scrollspeed="1000" data-scrollreset="500" data-min="20" data-max="100">Responsive Text with all of the options</h1>