diff --git a/README.md b/README.md index 7067467..359fdb3 100644 --- a/README.md +++ b/README.md @@ -28,6 +28,8 @@ The FitText directive will also watch the `ng-model` placed on the element, so g The `data-fittext-max=""` and `data-fittext-min=""` attributes respectfully limit the font size. This can also be set globally in the `fitTextConfigProvider` via `min` and `max`. +You may set `data-fittext-max` to the special value `"initial"` in order to prevent the font size from increasing beyond the CSS-computed style. This requires the `font-size` property to have been either inherited, or applied via a CSS selector. It does not work for inline `font-size` set via an inline `style` attribute. It also requires support for `window.getComputedStyle()` (IE 9+). + #### New lines To make use of new lines within a single FitText block you will need to use the `data-fittext-nl` attribute on each line wrapper. See the demo page for an example. diff --git a/src/ng-FitText.js b/src/ng-FitText.js index e5cc8a3..73fd6e7 100644 --- a/src/ng-FitText.js +++ b/src/ng-FitText.js @@ -40,6 +40,11 @@ var minFontSize = attrs.fittextMin || config.min || Number.NEGATIVE_INFINITY; var maxFontSize = attrs.fittextMax || config.max || Number.POSITIVE_INFINITY; + if(maxFontSize == 'initial' && window.getComputedStyle) { + element[0].style['font-size'] = ""; + maxFontSize = window.getComputedStyle(element[0])['font-size']; + } + var resizer = function() { element[0].style.fontSize = '10px'; var ratio = element[0].offsetHeight / element[0].offsetWidth / nl;