Ausblenden von Textarea Anfasser in Safari
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.)
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 /