Изменение размера шрифта в текстовом поле без увеличения размера текстового

Question

я бездельничал с некоторым Jquery иметь ползунок управление размером шрифта в текстовой области и использовать что-то вроде:

... 
slide: function(event, ui) { 
    $('#t_area').css("font-size", ui.value + "px"); 
} 
.... 

в функции управления ползунком , Я заметил, что даже когда у меня не было текста в текстовом поле, он по-прежнему увеличивался в размере, когда я перемещал слайдер (а также становился слишком большим, когда в нем был текст). Поэтому мне было интересно, есть ли способ увеличить размер текста без этого побочного эффекта?

Благодаря

Answer 1

размеры Установить на textarea. Демонстрация: http://jsfiddle.net/6qZAh/

textarea { 
    width: 100px; 
    height: 50px;  
} 

Без явных размеров, размер на основе строк/перевалы в textarea. Даже если эти значения не заданы явно, пользовательский агент использует значение по умолчанию.

Демо: http://jsfiddle.net/6qZAh/1/

$("textarea").on("click",function(){ 
    var t = $(this); 
    alert(t.prop("rows")); 
    alert(t.prop("cols")); 
}); 

В Chrome и IE9, это показывает мне "2" и "20".

Это, как представляется, spec-driven (курсив мой):

Ряды

Если применять правила для разбора неотрицательные целые числа к результатам значение атрибута в больше нуля, то значение этого символа должно соответствовать высоте символа элемента ; в противном случае, это 2.

Cols

Если применение правил для разбора неотрицательных целых чисел к результатам значения атрибута в числе больше нуля, то элемент ширина символа такова, что значение; в противном случае - 20.

Answer 2

CSS:

textarea { max-width:300px;max-height:300px; } 

Answer 3

Вы можете просто использовать CSS для этого.

textarea{ 
    width: 100px; 
    height: 100px; 
} 

Answer 4

if($('#t_area').text() != ""){  
    $('#t_area').css("font-size", ui.value + "px"); 
}