Entfernen Sie die Bildlaufleisten aus dem Textbereich

81

Nach meiner vorherigen Frage ( Hinzufügen einer Bildlaufleiste zu einem <Textbereich> ), wie die Bildlaufleiste immer in a angezeigt werden soll <textarea>, frage ich mich jetzt, wie Sie sie so einstellen würden, dass keine Bildlaufleiste in der angezeigt wird <textarea>, selbst wenn der Text überläuft. Um damit nach unten zu scrollen, würden Sie die Pfeiltasten oder die Maus verwenden, um durch den Text zu navigieren.

Wie kann ich das machen?

html scroll textarea scrollbar overflow user2370460
quelle
4
Hast du es versucht <textarea style="overflow:hidden"></textarea>?
Andyb

Antworten:

133

Versuchen Sie Folgendes, nicht sicher, welcher für alle Browser oder den Browser, mit dem Sie arbeiten, funktioniert, aber es ist am besten, alle zu testen:

<textarea style="overflow:auto"></textarea>

Oder

<textarea style="overflow:hidden"></textarea>

... wie oben vorgeschlagen

Sie können auch versuchen, dies hinzuzufügen. Ich habe es noch nie verwendet. Ich habe es heute auf einer Website veröffentlicht: 

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

Diese letzte Option würde die Möglichkeit zum Ändern der Größe von entfernen textarea. Weitere Informationen zur CSS- resizeEigenschaft finden Sie hier

Neunte Wanne
quelle
5
textarea_element.style.overflow = "versteckt"; (arbeitete in Firefox 44.0)
AAAfarmclub
Dieser Ansatz verbirgt die Bildlaufleiste, aber wenn Ihr Inhalt groß ist, wird er nicht mehr gescrollt.
Vano
Kombiniere mit stackoverflow.com/questions/58169328/growing-textarea-in-blazor
Jens Mander
15

style="overflow: hidden"und style="resize: none"waren diejenigen, die den Trick gemacht haben.

Dinder Logic
quelle
13
Wie genau ist das keine Antwort?
Robbo
7

Geben Sie scrolldem Textarea-Tag eine Klasse für z. B.: . Und im CSS diese Eigenschaft hinzufügen -

.scroll::-webkit-scrollbar {
   display: none;
 }
<textarea class='scroll'></textarea>
Erweitern Sie das Snippet

Es hat funktioniert, ohne den Scroll-Teil zu verpassen

NVRN SATISH
quelle
6

Bildlaufleiste ausblenden, aber dennoch mit CSS scrollen können

Um die Bildlaufleiste auszublenden, verwenden Sie -webkit-, da sie von gängigen Browsern (Google Chrome, Safari oder neuere Versionen von Opera) unterstützt wird. Es gibt viele andere Optionen für die anderen Browser, die unten aufgeführt sind:

    -webkit- (Chrome, Safari, newer versions of Opera):
    .element::-webkit-scrollbar { width: 0 !important }
    -moz- (Firefox):
    .element { overflow: -moz-scrollbars-none; }
    -ms- (Internet Explorer +10):
    .element { -ms-overflow-style: none; }

Ref: https://www.geeksforgeeks.org/hide-scroll-bar-but-while-still-being-able-to-scroll-using-css/

user12472501
quelle
0

Ich konnte meine Bildlaufleiste im Textkörper entfernen, indem ich mein Attribut für die maximale Höhe meiner Klasse entfernte.

SauerTrout
quelle