Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
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);
};
@forthekill

This comment has been minimized.

Copy link

forthekill commented Nov 23, 2016

Thanks for this!

One issue I have is that when I call this on window resize, it works when the window gets smaller, but not when the window gets bigger.

I can't quite figure out why looking at the code. Any ideas?

@dibiler

This comment has been minimized.

Copy link

dibiler commented Dec 20, 2016

@forthekill:

The plugin doesn't work as you need, it only checks if the text fits in the box so when the window gets bigger it's fitting inside the box so it won't change a thing. The Plugin could be updated to make it always as big or small as to fit the text in perfectly, Right now it only shrinks the text it doesn't enlarge it.

@LinuxRocks2000

This comment has been minimized.

Copy link

LinuxRocks2000 commented Jul 10, 2018

i my stylesheet i set the text size to 1000px, the script did not resize. my js is set to run after css, why is this happening?

@jmeile

This comment has been minimized.

Copy link

jmeile commented Feb 28, 2019

Any notes about how to use it? Let's say that I have a div with an id of: "my_div". How do you use it on that div?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.