diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md new file mode 100644 index 0000000..2e18c0a --- /dev/null +++ b/CONTRIBUTING.md @@ -0,0 +1,13 @@ +## Submitting issues + +### Reduced test case required + +All bug reports and problem issues require a reduced test case. See [CSS Tricks - Reduced Test Cases](http://css-tricks.com/reduced-test-cases/) on why they _"are the absolute, ... number one way to troubleshoot bugs."_ + ++ A reduced test case is an isolated example that demonstrates the bug or issue. ++ It contains the bare minimum HTML, CSS, and JavaScript required to demonstrate the bug. No extra functionality or styling. ++ A link to your site is **not** a reduced test case. ++ A [CodePen](http://codepen.io) is preferred so we can help you fix an error. ++ Until you provide a reduced test case, your issue will be closed. + +This guideline may seem a little harsh, but it helps dramatically. Reduced test cases help you identify the issue at hand and understand your own code. On our side, they greatly reduce the amount of time spent resolving the issue. \ No newline at end of file diff --git a/README.md b/README.md index 79fc0e0..cb08849 100644 --- a/README.md +++ b/README.md @@ -28,21 +28,26 @@ This will hopefully give you a level of "control" that might not be pixel perfec FitText now allows you to specify two optional pixel values: `minFontSize` and `maxFontSize`. Great for situations when you want to preserve hierarchy. ```javascript -jQuery("#responsive_headline").fitText(1.2, { minFontSize: '20px', maxFontSize: '40px' }) +jQuery("#responsive_headline").fitText(1.2, { minFontSize: '20px', maxFontSize: '40px' }); ``` ## CSS FAQ -- **Make sure your container has a width!** +- :warning: Run FitText before anything that hides the element you're trying to size (e.g. before Carousels, Scrollers, Accordions, Tabs, etc). Hiding an element's container removes its width. It can't resize without a width. +- :warning: **Make sure your container has a width!** - `display: inline` elements don't have a width. Use `display: block` OR `display: inline-block`+ a specified width (i.e. `width: 100%`). - `position:absolute` elements need a specified width as well. - Tweak until you like it. - Set a No-JS fallback font-size in your CSS. +- :new: If your text is full width, you might want to **NOT** use FitText and just use CSS `vw` units instead. Supported in all major browsers. ## Don't use jQuery? That's okay. Check out these handy non-jQuery versions maintained by other people. - [non-jQuery FitText](https://github.com/adactio/FitText.js) from @adactio +- [Angular.js FitText.js](https://github.com/patrickmarabeas/AngularJS-FitText.js) from @patrickmarabeas +- [AMP-HTML FitText](https://github.com/ampproject/amphtml/tree/master/extensions/amp-fit-text) +- [FitText UMD](https://github.com/peacechen/FitText-UMD) by @peacechen ## Changelog * `v 1.2` - Added `onorientationchange` event @@ -53,7 +58,7 @@ That's okay. Check out these handy non-jQuery versions maintained by other peopl ## In Use: - [Trent Walton](http://trentwalton.com) -If you want more exact fitting text, there are plugins for that! We recommend checking out [BigText](https://github.com/zachleat/BigText) by Zach Leatherman or [SlabText](http://www.frequency-decoder.com/demo/slabText/) by Brian McAllister. +If you want more exact fitting text, there are plugins for that! We recommend checking out [BigText](https://github.com/zachleat/BigText) by Zach Leatherman or [SlabText](https://github.com/freqDec/slabText) by Brian McAllister. ### Download, Fork, Commit. If you think you can make this better, please Download, Fork, & Commit. We'd love to see your ideas. diff --git a/bower.json b/bower.json new file mode 100644 index 0000000..c4887a3 --- /dev/null +++ b/bower.json @@ -0,0 +1,12 @@ +{ + "name": "jquery-fittext", + "version": "1.2.0", + "main": "jquery.fittext.js", + "dependencies": { + "jquery": ">= 1.6" + }, + "ignore": [ + "example.html", + "CONTRIBUTING.md" + ] +} diff --git a/component.json b/component.json deleted file mode 100644 index 77bbb7e..0000000 --- a/component.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "name": "FitText.js", - "version": "1.2.0", - "main": "./jquery.fittext.js", - "dependencies": { - "jquery": ">= 1.6" - } -} diff --git a/jquery.fittext.js b/jquery.fittext.js index 080b82e..0b3ddef 100644 --- a/jquery.fittext.js +++ b/jquery.fittext.js @@ -1,6 +1,6 @@ /*global jQuery */ /*! -* FitText.js 1.1 +* FitText.js 1.2 * * Copyright 2011, Dave Rupert http://daverupert.com * Released under the WTFPL license