Форум АНТИЧАТ - растягиваемая мышью текстареа (как?)

Форум АНТИЧАТ (https://forum.antichat.xyz/index.php)

- PHP, PERL, MySQL, JavaScript (https://forum.antichat.xyz/forumdisplay.php?f=37)

- - растягиваемая мышью текстареа (как?) (https://forum.antichat.xyz/showthread.php?t=105443)

растягиваемая мышью текстареа (как?)

есть в друпале такая фича - задаёшь textarea класс и её нижняя кромка превращается в таскабельный прямоугольник, за который можно тянуть мышью и тем самым менять размер textarea.

как поюзал - теперь мучаюсь ужасно от нехватки этой фичи в других веб-приложениях, типа того же phpmyadmin, в котором зачастую очень сложно просматривать запрос в маленькой textarea.

в друпале эта хрень реализована на основе jquery и зашита где-то в движке.
мне ужасно лень рыться и доставать её оттуда, поэтому создаю эту тему - может у кого-нибудь есть готовая реализация непосредственно фичи? и очень желательно чтобы обходилась без jquery.

либо выкладывайте плз свои предположения по поводу того, как такое реализовать без jquery - и я этим займусь.. потом добавлю в phpmyadmin и выложу патч :)

на ачате есть прикол в расширенной форме ответа, типа внизу под текстареа, две надписи, жмякаяшь на одну, она увеличивает размер текстареа, жмякаешь на вторую уменьшает... может быть поможет?

Пока такое нашел, чо найду еще - напишу

Растягивающийся textarea

Представим ситуацию когда пользователь вводит комментарий в textarea высотой 100px. Если комментарий умещается в эту область, то все отлично. Но если комментарий в несколько раз больше, то появляется прокрутка, которая может раздражать пользователя. Тогда можно растягивать textarea по высоте по мере заполнения. Вот так

// 500 - макс высота до которой будет растягиваться textarea
// 100 - изначальная высота textarea
<textarea style="width:600px; font-size:14px; height:100px;"
onkeyup="this.style.height=(a=(e=parseInt(this.sty le.fontSize)*(this.value.split('\n').length+2))
>(e2=500)?e2:e)<100?100:a;"></textarea>

Источник: http://ekimoff.ru/tag/javascript/

ну и в итоге то, что ты искал:

http://blogerstyle.com/jquery/avto-rastyagivayushheesya-pole-na-jquery

Цитата:

Авто-растягивающееся поле на jQuery

25.12.2008

Еще один плагин на jQuery, который мне по душе — Auto-Growing Textarea.

В отличие от плагинов, которые позволяют растягивать поле textarea вручную, Auto-Growing Textarea растягивает поле по мере добавления текста. На мой взгляд, это гораздо удобнее — и действий не надо лишних совершать и весь текст перед глазами )

<script type="text/javascript" src=".../jquery.js">
</script>
<script type="text/javascript" src=".../jquery.autogrow.js">
</script>
<script type="text/javascript">

$(document).ready (function() {
$('textarea.expanding').autogrow();
});
</script>

...

<textarea style="width: 300px; min-height: 100px;" class="expanding" name="myTextarea3"> <textarea>

во) нарисовал:

PHP код:


		
			
<script type="text/javascript">    

function size(size, num){



    var field = document.getElementById('txt');

    if(size == 'h'){



        var height = field.style.height.replace('px', '');

        field.style.height = parseInt(height) + num + 'px';



    }else if(size == 'w'){



        var width = field.style.width.replace('px', '');

        field.style.width = parseInt(width) + num + 'px';



    }

}

</script>



<form name="forma" method="get">

<textarea cols="50" rows="10" style="width:300px;height:150px" name="txt" id="txt"></textarea><br/>

Высота <a href="javascript: size('h', 100)">+</a> <a href="javascript: size('h', -100)">-</a><br/>

Ширина <a href="javascript: size('w', 100)">+</a> <a href="javascript: size('w', -100)">-</a>

</form>

Pashkela

Цитата:

желательно чтобы обходилась без jquery

А с перетаскиванием это нужно с Plug & Play. Щас попробую замутить)

Pashkela

Цитата:

// 500 - макс высота до которой будет растягиваться textarea
// 100 - изначальная высота textarea
<textarea style="width:600px; font-size:14px; height:100px;"
onkeyup="this.style.height=(a=(e=parseInt(this.sty le.fontSi ze)*(this.value.split('\n').length+2))
>(e2=500)?e2:e)<100?100:a;"></textarea>

спасибо, оч. красивое решение

а вот второе с джиквери - имхо отстой, при учете наличия первого.
мало того что требуется наличие jquery+plugin 57 kb --- (у меня в движке страницы по 3 кб весят!) так ещё и глючно: бордер у текстареи пропадает, сначала ваще не мог понять где текстарея, а когда несколько раз пощёлкал ентер скрипт завис и низ текстареи до сих пор подёргивается на месте..

blaga
ага, видел.
по-моему админам пофигу на мелкие глюки ачата - там текст сливается с фоном, в редактировании поста я могу видеть свою старую подпись, хотя движок её не показывает больше нигде.

.:EnoT:.
научил меня как правильно менять значение, содержащее 'px' :)

В общем, пока, самое первое решение Pashkela - лучшее, но думаю можно найти подобное - красивое и минималистичное - для того чтобы тягать текстарею мышкой.

Все понимают что я имею ввиду?
на http://drupal.ru/ есть такая арея, но там надо регаться, чтобы её увидеть.
вот она к примеру здесь: http://drupal.ru/node/24005?destination=node%2F24005

жаль что никто не знает =\

Вот простой пример растягивание textarea по вертикали

Код:

<html>

<head>

<style>

div.text_editor textarea

{

  width: 398px;

  height:100px;

} div.text_editor div { 

  background: #e2e2e2 url("resizer.gif") no-repeat;

  background-position:center;

  height:10px;

  width:400px;

  font-size:.01em;/* поправка высоты для IE */

  cursor:s-resize;

}

</style>

<script src="textareaResizer.js"></script>

<title>Демонстрация textareaResizer</title>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

</head>

<body>

<h1>Пример</h1>

<div class="text_editor">

<textarea name="text" id="ta_text">Этот textarea будет растягиваться по вертикали</textarea>

<div id="ta_text_resizer" onMouseDown="textareaResizer(event);">&nbsp;</div>

</div>

</body>

</html>

cash$$$
а где: <script src="textareaResizer.js"></script ??

Дикс, ты постоянно говоришь про друпал. Что тебе мешает выдрать этот код из друпала? Имхо ставь на jquery, я свой двиг тоже делаю и там его использую

я говорил что в моём движке страницы по 2-3 килобайта и не единой картинки?
как думаешь, разумно будет подключать туда 30 кб jquery на каждой странице?