مختبئة Textarea تغيير حجم مقبض في رحلات السفاري

Question

أنا أستخدم مكونات Textarea في طلبي، وأتحكم في ارتفاعها بشكل ديناميكي. نظرا لأن أنواع المستخدمين، يتم زيادة الارتفاع كلما كان هناك نص كاف. هذا يعمل بشكل جيد على IE و Firefox و Safari.

ومع ذلك، في Safari، يوجد أداة "مقبض" في اليمين السفلي الذي يسمح للمستخدم بتغيير حجم Textarea بالنقر والسحب. لقد لاحظت أيضا هذه المشكلة مع Textarea في Stackoverflow اسأل صفحة سؤال. هذه الأداة مربكة ويحصل في الطريق بشكل أساسي.

لذلك، هل هناك على أي حال لإخفاء هذا المقبض تغيير الحجم؟

(لست متأكدا إذا "التعامل" هو الكلمة الصحيحة، لكنني لا أستطيع التفكير في مصطلح أفضل).

Answer 1

يمكنك تجاوز سلوك تغيير الحجم مع CSS:

textarea
{
   resize: none;
}

أو ببساطة فقط

<textarea style="resize: none;">TEXT TEXT TEXT</textarea>

خصائص صالحة هي: كلاهما، أفقي، عمودي، لا شيء

Answer 2

استخدم قاعدة CSS التالية لتعطيل هذا السلوك للجميع TextArea عناصر:

textarea {
    resize: none;
}

إذا كنت ترغب في تعطيلها لبعض (ولكن ليس كل) TextArea العناصر، لديك اثنين من الخيارات (بفضل هذه الصفحة).

لتعطيل معين TextArea مع ال name سمة مجموعة على foo (بمعنى آخر، <TextArea name="foo"></TextArea>):

textarea[name=foo] {
    resize: none;
}

أو باستخدام معرف (أي <TextArea id="foo"></TextArea>):

#foo {
    resize: none;
}

لاحظ أن هذا مناسب فقط للمتصفحات القائمة على WebKit (أي Safari و Chrome)، والتي تضيف مقبض تغيير الحجم إلى TextArea ضوابط.

Answer 3

فرصة Safari Max-Height Max-Width تعمل أيضا في Firefox 4.0 (B3PRE). مثال جيد هنا بالمناسبة: http://www.alanedwardes.com/posts/safari-and-resizable-textbox/