Найти разрывы строк

Question

Я использую javascript, чтобы найти идеальный размер шрифта для любого размера экрана, который может заполнить div специальной шириной (например, 70% или 40% от родителя), и я хочу достичь этой цели сделав текст размера шрифта 0.1em больше на 0.1em, пока он не заполнит родительскую ширину или если произойдет разрыв строки. я попытался найти, насколько увеличилась моя высота текста после использования нового размера шрифта, и если новая высота больше 1,7 * последней высоты, я остановлю скрипт, потому что там должен быть разрыв строки, но этот код не работает на некоторых более мелких устройствах. есть ли способ найти разрывы строк, используя jquery, который работает на всех размерах экрана?

вот мой код:

var fit = function(inner , outter) 
{ 
    var $inner = $("#"+inner), //rememver "var" 
    $outter = $("#"+outter), 
    fsize = 0.1 ; 
    while(true) 
    { 
     var fheight = $outter.height(); 
     var a = fsize + "em" ; 
     $inner.css({'font-size' : a}); 
     if((1.7 * fheight) < $outter.height()) 
     { 
      fsize = fsize - 0.1 ; 
      a = fsize + "em"; 
      $inner.css({'font-size' : a}); 
      return; //change breck with return (that return all function) 
     } 
     if($outter.width() < $inner.width()) 
     { 
      fsize = fsize - 0.1 ; 
      a = fsize + "em"; 
      $inner.css({'font-size' : a}); 
      return; //change breck with return (that return all function) 
     } 
     fsize = fsize + 0.1 ; 
    } 
}; 

Answer 1

Это может быть сделано с использованием значений РХ размера шрифта, а Эминема?

Проверить это решение:

http://jsfiddle.net/68LCb/4/

HTML:

<div class="asd">asdasd asd Lorem ipsum dolor sit amet, consectetur adipisicing elit. 
</div> 

CSS:

.asd { 
    width: 60%; 
    margin: 0 auto; 
    outline: 1px solid red; 
    /*unfortunatelly THIS has to be specified; */ 
    font-size: 12px; 
    line-height: 1; 
} 

JQuery:

$(document).ready(function() { 
    shrinkText($('.asd')); 
}) 

function shrinkText(d) { 
    d.css({'font-size': parseInt(d.css('font-size'))+1}); 
    var diff = d.height() - parseInt(d.css('line-height')); 
    console.log(diff); 
    if (diff > 0) 
     d.css({'font-size': parseInt(d.css('font-size'))-1}); 
    else 
     shrinkText(d); 
} 

Answer 2

http://jsbin.com/AyUgUhO/2/edit?html,js,output

Используя этот лил кусок кода

var p = $('p'), w = $(document.body).innerWidth(); 
p.css({ 
    'font-size': '1px', 
    'float': 'left', 
    'white-space': 'nowrap' 
}); 
for(var i = 1; i < w; ++i){ 
    p.css({ 
    'font-size': i+'px' 
    }); 
    if(p.width() > w) return; 
}