Resize text based on div width

I'm looking for a solution for this that has more precision than breakpoints. I'm aware this will require JavaScript but I am having trouble finding a suitable plugin.

The majority of text on my site will stay the same, or I will simply adjust it with media queries (say 90% for tablet and mobile). That's fine, but I'm looking for a "real-time" solution" for areas such as my navigation menu and my banners.

See the site here

You can see all my text is relative and sized using ems with a base font-size of 100%

If you resize the site you'll notice the menu "crashes" as the font size becomes too big. I'm keen to find a JS solution that will resize that text down relative to the width of the navigation bar so that I can always keep it all on one line (At mobile width, it'll go down into a collapsed menu)

---

Check out this jquery plugin

http://simplefocus.com/flowtype/

It resized font-size and line-height based on element width.

链接地址: http://www.djcxy.com/p/87522.html

上一篇: 将文本保留在一行上并缩放字体

下一篇: 根据div宽度调整文本大小