TextArea يتمدد مع النص

[owner]

السلام عليكم ..

كود بسيط مع مكتبة الجافا jQuery

وظيفة الكود :
تمدد طول TextArea مع طول النص بدل من تفعيل الScroll Bar (شريط التمرير)

المكتبة :
jQuery

عدد الملفات :
2

Screen Shot:


طريقة العمل :
استعد ملفات الجافا سكربت في هيدر الصفحة :

<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.owner').autogrow();
 
});
</script>

textarea.owner هو اسم الستايل الخاص بالـtext Area

وبعد ذلك اضف ملف ستايل خاص بالtextArea

textarea.owner {
 width: 400px;
 line-height: 16px;
 min-height: 84px;
 height: 84px;
 font-family: tahoma;
 font-size: 11px;
 direction:rtl;
}

مهم جدا تحديد الـ

• line-height
• min-height

يمكنك اضافة الستايل اما في هيدر الصفحة او عن طريق ملف منفصل واستدعائه في هيدر الموقع :

لوضع الستايل في هيدر الصفحة ضع هذا الكود في الهيدر ايضا :

<style type="text/css">
textarea.owner {
 width: 400px;
 line-height: 16px;
 min-height: 84px;
 height: 84px;
 font-family: tahoma;
 font-size: 11px;
 direction:rtl;
}
</style>

واخير اضف في محتوى الصفحة وفي اي مكان تريد :

<textarea class="owner" name="myTextarea"></textarea>

لتحميل الملفات :
رابط # 01 :
zSHARE - textarea.rar
رابط # 02 :
textarea.rar
رابط # 03 :
Send big files the easy way. Files too large for email attachments? No problem!

-----
TextArea ظٹطھظ…ط¯ط¯ ظ…ط¹ ط§ظ„ظ†طµ | آ« Aخ“D!ذ¯AZi آ»

بالتوفيق ان شاء الله

[TechSouhaile]

بارك الله فيك وجزاك الله أحسن الحزاء

[jadweb.com]

جزاك الله خير اخوي , ولكن عند التمديد تتحرك الشاشة بشكل غير جيد .