davatron5000 / FitText.js

A jQuery plugin for inflating web type
http://fittextjs.com
6.75k stars 1.39k forks source link

Issue with hidden text #58

Closed mccombs closed 11 years ago

mccombs commented 11 years ago

Hey guys - I noticed today that if you use fitText on text within a hidden area, it can't render the correct size, even if you're hiding the parent container.

Currently searching for a solution.

davatron5000 commented 11 years ago

So when a div has display:none applied, it's height/width is calculated as 0. So the only effective way to apply fitText to a hidden div is to:

  1. Higher execution order: Apply fitText before the target div is hidden.
  2. Apply fitText when the item is shown: jQuery('.myelement').show().find('h1').fitText(); or something of that nature.
davatron5000 commented 11 years ago

1 more suggestion: If you're using jQuery Tabs or something similar trigger a resize in your callback.

$('.tabs').tabs({
  activate: function(){ 
    $(window).trigger('resize');
  }
}
mccombs commented 11 years ago

Got it! Totally did it dirty but I can draw the size of the area off screen and then reposition with animation using jquery.

Thanks Dave!