Skip to content

Instantly share code, notes, and snippets.

@iamkirkbater
Created August 6, 2014 13:45
Show Gist options
  • Star 12 You must be signed in to star a gist
  • Fork 4 You must be signed in to fork a gist
  • Save iamkirkbater/ee9741a02431290682e6 to your computer and use it in GitHub Desktop.
Save iamkirkbater/ee9741a02431290682e6 to your computer and use it in GitHub Desktop.
Simple jQuery Plugin that auto resizes text to fill a specific sized div (great for responsive slideshows that utilize large banner text with variable lengths), derived from https://gist.github.com/iam4x/5015270
$.fn.autoSizr = function () {
var el, elements, _i, _len, _results;
elements = $(this);
if (elements.length < 0) {
return;
}
_results = [];
for (_i = 0, _len = elements.length; _i < _len; _i++) {
el = elements[_i];
_results.push((function(el) {
var resizeText, _results1;
resizeText = function() {
var elNewFontSize;
elNewFontSize = (parseInt($(el).css('font-size').slice(0, -2)) - 1) + 'px';
return $(el).css('font-size', elNewFontSize);
};
_results1 = [];
while (el.scrollHeight > el.offsetHeight) {
_results1.push(resizeText());
}
return _results1;
})(el));
}
return $(this);
};
@Ashtlind
Copy link

Ashtlind commented May 12, 2021

To make this grow and shink here is a simple hack on line 10. Crude but works for my use case. 200px may be extreme in some cases.

$.fn.autoSizr = function () {
	var el, elements, _i, _len, _results;
	elements = $(this);
	if (elements.length < 0) {
		return;
	}
	_results = [];
	for (_i = 0, _len = elements.length; _i < _len; _i++) {
		el = elements[_i];
		$(el).css({'font-size' : '200px'})
		_results.push((function(el) {
		var resizeText, _results1;
		resizeText = function() {
			var elNewFontSize;
			elNewFontSize = (parseInt($(el).css('font-size').slice(0, -2)) - 1) + 'px';
			return $(el).css('font-size', elNewFontSize);
		};
		_results1 = [];
		while (el.scrollHeight > el.offsetHeight) {
			_results1.push(resizeText());
		}
		return _results1;
		})(el));
	}
	return $(this); 
	};

Usage:

$('#myDivId').autoSizr();

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment