Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: avtosize textarea на javascript
Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript » avtosize textarea на javascript

Страниц (1): [1]
 

1. vader - 25 Февраля, 2009 - 21:01:46 - перейти к сообщению
суть такая.... сбоку на поле <textarea> нет ползунка при этом если строка не помещается на выделеное для него место размеры поле увеличиваются в длину! очень полезная штука потому. что не будет занимать лишнего пространства на стр. больше чем нужно!
посмотрите стр. из сайта [в]контакте там оно используется.. пожалуйста помогите с ней разобратся.. тобишь выделить функцию со всего кода и показать на любой форме пример ее использования)) или помогите сделать что то подобное!
(Добавление)
CODE (text):
скопировать код в буфер обмена
  1. function checkAutosizeTextarea(id, e) {
  2.         var text_area = ge(id);
  3.         var val = text_area.value;
  4.         if (e) {
  5.                 if ((e.keyCode == 13) && (!e.ctrlKey) && (!e.altKey)) {
  6.                         val += '\n';
  7.                 }
  8.         }
  9.  
  10.         if (val == eval(id + '_params_wrapper["old_v"]')) {
  11.                 return;
  12.         }
  13.  
  14.         setFieldValue(eval(id + '_params_wrapper'), 'old_v', val);
  15.  
  16.         var text_area_div = ge(id + 'sdfasta');
  17.         var htmled_val = val.replace(/&/g,'&').replace(/"/g,'"').replace(/'/g,''').replace(/</g,'<').replace(/>/g,'>').replace(/\n/g,'<br />');
  18.  
  19.         text_area_div.innerHTML = htmled_val;
  20.  
  21.         text_area = ge(id);  
  22.         text_area_div = ge(id + 'sdfasta');
  23.  
  24.         var new_height = (text_area_div.clientHeight + eval(id + '_params_wrapper["font_s"]') * 2);
  25.         var min_height = eval(id + '_params_wrapper["min_h"]');
  26.         if (new_height < min_height) {
  27.                 new_height = min_height;
  28.         }
  29.  
  30.         text_area.style.height = new_height + "px";
  31. }
  32.  
  33. function autosizeTextareaUpdated(id, pass_event) {
  34.         return function(e) {
  35.                 checkAutosizeTextarea(id, pass_event ? e : false);
  36.         };
  37. }
  38.  
  39. function setFieldValue(obj, field, value) {
  40.         obj[field] = value;
  41. }
  42.  
  43. function makeAutosizeTextarea(id, min_height) {
  44.         var div_for_autosize_textareas = ge('div_for_autosize_textareas');
  45.         if (!div_for_autosize_textareas) {
  46.                 div_for_autosize_textareas = document.createElement('div');
  47.                 div_for_autosize_textareas.id = "div_for_autosize_textareas";
  48.                 document.body.appendChild(div_for_autosize_textareas);
  49.         }
  50.         div_for_autosize_textareas.innerHTML += '<div id="' + id + 'sdfasta" style="position: absolute; left: -10000px; top: -10000px;"></div>';
  51.         var text_area = ge(id);
  52.         var text_area_div = ge(id + 'sdfasta');
  53.  
  54.         text_area.style.overflowX = 'hidden';
  55.         text_area.style.overflowY = 'hidden';
  56.  
  57.         var div_width = css.getStyle(text_area, 'width', true);
  58.         if (!div_width) {
  59.                 div_width = parseInt(text_area.style.width);
  60.         }
  61. /*      if (rdyMgr.isOp) {
  62.                 div_width -= 0;
  63.         } else if (rdyMgr.isIE) {
  64.                 div_width -= 0;
  65.         } else if (rdyMgr.isSaf) {
  66.                 div_width -= 0;
  67.         } else if (rdyMgr.isFF) {
  68.                 div_width -= 0;
  69.         } else if (rdyMgr.isGC) {
  70.                 div_width -= 0;
  71.         }*/
  72.         text_area_div.style.width = div_width + "px";
  73.         text_area_div.style.fontFamily = css.getStyle(text_area, 'fontFamily', false);
  74.         text_area_div.style.fontSize = css.getStyle(text_area, 'fontSize', true) + 'px';
  75.         text_area_div.style.lineHeight = css.getStyle(text_area, 'lineHeight');
  76.  
  77.         events.addEvent(text_area, 'keydown', autosizeTextareaUpdated(id, true));
  78.         events.addEvent(text_area, 'keypress', autosizeTextareaUpdated(id, true));
  79.         events.addEvent(text_area, 'keyup', autosizeTextareaUpdated(id, false));
  80.  
  81.         var old_v = '';
  82.         var min_h = css.getStyle(text_area, 'height', true);
  83.         if (!min_h) {
  84.                 min_h = text_area.clientHeight;
  85.         }
  86.         if (!min_h) {
  87.                 min_h = parseInt(text_area.style.height);
  88.         }
  89.         if (min_height) {
  90.                 min_h = min_height;
  91.         }
  92.         var font_s = css.getStyle(text_area_div, 'fontSize', true);
  93.  
  94.         eval(id + '_params_wrapper = new Object()');
  95.         setFieldValue(eval(id + '_params_wrapper'), 'old_v', old_v);
  96.         setFieldValue(eval(id + '_params_wrapper'), 'min_h', min_h);
  97.         setFieldValue(eval(id + '_params_wrapper'), 'font_s', font_s);
  98.  
  99.         checkAutosizeTextarea(id);
  100. }
  101.  
  102. function autosizeTextarea(id, min_height) {
  103.         onDomReady(function() {
  104.                 makeAutosizeTextarea(id, min_height);
  105.         });
  106. }


Вот то что смог откопать сам)) это можно как нибудь обрезать???? так сказать повырезать ненужное и свести к минимуму)))
2. valenok - 25 Февраля, 2009 - 21:21:12 - перейти к сообщению
3. CodeWarrior - 25 Февраля, 2009 - 21:29:09 - перейти к сообщению
Кто-нибудь ответит? Зачем нужна такая функция? Может я непонимаю что-то в такой роскоши?
4. vader - 25 Февраля, 2009 - 21:38:30 - перейти к сообщению
valenok пишет:
http://www.aclevercookie.com/demos/autogrow_textarea.html

слушай.. спасибо большое! это то что нужно... только не пойму как ее нужно использовать!? даш пример?
вот там написано:
CODE (text):
скопировать код в буфер обмена
  1.  
  2. $(document).ready (function() {
  3.        
  4.         $('textarea.expanding').autogrow({
  5.                 maxHeight: 100,
  6.                 minHeight: 30,
  7.                 lineHeight: 16
  8.         });
  9.                                                        
  10. });

но я неразобрался! если можешь дай пример!?
id поля = "message"; а ширину и высоту любую...
заранее спасибо!

 

Powered by ExBB FM 1.0 RC1