Как увеличить только размер текста?

0

У меня есть код, по которому я увеличиваю размер текста, который находится в текстовой области, и я могу сделать это с помощью заданного кода, но здесь есть одна проблема со мной, что при увеличении размера текста он увеличивает размер области текста и я не хотите этого, а также хотите, чтобы область текста прокручивалась

код приведен ниже:

<HTML>
<head>


<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>


<script>
$(function () {
    $('select[name="font"]').on('change', function () {
      $('textarea').css('font-family', this.value);

    });
});
</script>
</head>



<body>
Select Programming font:
<select name="font">
    <option value="arial">arial black</option>
    <option value="tahoma">tahoma</option>
    <option value="times new roman">times new roman</option>
    <option value="calibri">calibri</option>
</select>

<select onchange="$('#txt').css('font-size', event.target.value + 'px')">
  <option value="10">10</option>
  <option value="20">20</option>
  <option value="30">30</option>
</select>

<br>EnterValue:
<textarea id="txt" rows="4" cols="50">Test Test</textarea>

</body>
</html>
  • 0
    Пожалуйста, проверьте мое решение, если вы не хотите устанавливать фиксированную ширину и высоту для вашего textarea
Теги:

4 ответа

0
Лучший ответ

использовать css resize:none;overflow:auto;width:100px;height:50px с textarea

<textarea id="txt" rows="4" cols="50" style="resize:none;overflow:auto;width:300px;height:50px">Test Test</textarea>

Демо: http://jsfiddle.net/9BGT2/

  • 0
    как я могу использовать это, дорогой, ты можешь сказать мне
  • 0
    обновил мой код
Показать ещё 3 комментария
2

Дайте свои текстовые размеры с помощью CSS. Затем вы можете установить свойство переполнения в auto, что сделает браузер автоматически отображать полосу прокрутки, где это уместно:

#txt{
    height:40px;
    width:200px;
    overflow:auto;
}

JSFiddle

0
<textarea id="txt" rows="4" cols="50" style="width:400px;height:100px">Test Test</textarea>
0

Вы можете получить ширину и высоту textarea поля перед изменением размера шрифта, а затем вернуть его в textarea:

$(function () {
    var width = $('textarea').width(),
        height = $('textarea').height();
    $('select[name="font"]').on('change', function () {
        $('textarea').css('font-family', this.value);
        $('textarea').width(width);
        $('textarea').height(height);
    }).change();
});

Это решение не требует установки фиксированной ширины и высоты для вашего textarea

Демо-версия скрипта

Ещё вопросы

Сообщество Overcoder
Наверх
Меню