Is it possible to tell a h1 to size the text so it fills the full 100% width of the element?
Like this.
code:
<h1>FOO</h1>
<h1>BAAR</h1>
Try this plugin.
It's great for responsive text.
EDIT:
jQuery("#element1").fitText(1.2, { minFontSize: '20px', maxFontSize: '540px' });
jQuery("#element2").fitText(1.2, { minFontSize: '40px', maxFontSize: '340px' });
I found a plugin called bigtext that works pretty well, will wait for comments though.
One possible solution with jQuery would be:
var cs=$("#content").width();
$("h1").each(function(){
var hs=$(this).width();
while(hs<cs)
{
$("h1").css("font-size",hs+0.01+"px");
var hs=$(this).width();
}
while(hs>cs)
{
$("h1").css("font-size",hs-0.01+"px");
var hs=$(this).width();
}
})
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.