Frage

Ich verwende TextArea- Komponenten in meiner Anwendung, und ich kontrolliere ihre Höhe dynamisch. Da der Benutzer tippt, wird die Höhe erhöht, wenn es genügend Text. Dies funktioniert auf IE, Firefox und Safari.

Doch in Safari gibt es einen „Griff“ Werkzeug in der unteren rechten Ecke, der Benutzer den Textbereich durch Klicken und Ziehen, um die Größe ermöglicht. Ich habe auch bemerkt dieses Problem mit dem Text in der Stackoverflow eine Seite Frage stellen. Dieses Tool ist verwirrend und wird grundsätzlich im Wege.

So ist es trotzdem diese Anfasser zu verbergen?

(Ich bin nicht sicher, ob „Griff“ ist das richtige Wort, aber ich kann nicht glauben, einen besseren Begriff.)

War es hilfreich?

Lösung

Sie können die Größe ändern Verhalten mit CSS außer Kraft setzen:

textarea
{
   resize: none;
}

oder einfach

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

Gültige Eigenschaften sind: beide, horizontal, vertikal, kein

Andere Tipps

Verwenden Sie die folgende CSS-Regel dieses Verhalten für alle TextArea Elemente zu deaktivieren:

textarea {
    resize: none;
}

Wenn Sie möchten, um sie deaktivieren für einige (aber nicht alle) TextArea Elemente, Sie haben ein paar Optionen (dank diese Seite ).

Um einen bestimmten TextArea mit dem Attribut name deaktivieren auf foo (d.h. <TextArea name="foo"></TextArea>):

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

Oder mit einer ID (das heißt <TextArea id="foo"></TextArea>):

#foo {
    resize: none;
}

Beachten Sie, dass dies für WebKit-basierten Browser nur relevant ist (das heißt, Safari und Chrome), die die Anfasser hinzufügen Steuerelemente TextArea.

die Safari max-height max-width Gelegenheit funktioniert auch in Firefox 4.0 (b3pre). gutes Beispiel hier übrigens: http://www.alanedwardes.com/ Beiträge / Safari-and-resizable-area per /

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top