Responsive-Measure
JavaScript
Switch branches/tags
Nothing to show
Latest commit 2a15f9e Mar 6, 2017 @jbrewer committed on GitHub RM stuff that never got updated.
Permalink
Failed to load latest commit information.
examples updated example files Sep 17, 2012
README.md RM stuff that never got updated. Mar 6, 2017
jquery.rm.js Merge pull request #2 from adamnbowen/strict Oct 15, 2012

README.md

This plugin is no longer supported. Leaving things up so I don't cause more link rot.

Responsive-Measure

A jQuery plugin for generating a responsive ideal measure.

Getting Started

Download the javascript

In your web page:

<script src="jquery.js"></script>
<script src="jquery.rm.js"></script>
<script type="text/javascript">

$('section').responsiveMeasure({
	// Variables you can pass in:
	idealLineLength: (defaults to 66),
	minimumFontSize: (defaults to 16),
	maximumFontSize: (defaults to 300),
	ratio: (defaults to 4/3)
});

  </script>

Extended feature(s)

This plugin includes a feature for generating a typographic scale that you can apply automagically on resize.

$(document).on('responsiveMeasureUpdated', function(e, data) {
	$('.giga').css('fontSize', data.fontRatios[9] + 'px');
	$('h1').css('fontSize', data.fontRatios[8] + 'px');
	$('h2').css('fontSize', data.fontRatios[7] + 'px');
	$('h3').css('fontSize', data.fontRatios[6] + 'px');
	$('p').css('fontSize', data.fontRatios[5] + 'px');
	$('.sm').css('fontSize', data.fontRatios[4] + 'px');
});

License

Copyright (c) 2012 Josh Brewer Licensed under the MIT, GPL licenses.