Vertikales Scrollen im Textbereich aktivieren

Lesezeit: 2 Minuten

Hozefa

Ich habe einen Textbereich, in dem ich vertikales Scrollen aktivieren möchte. Wenn ich die Höhe des Textbereichs überschreite, wird er größer. Die Bildlaufleiste wird nicht angezeigt. Ich möchte, dass eine vertikale Bildlaufleiste angezeigt wird und die Benutzer auch nicht in der Lage sind, die Größe des Textbereichs zu ändern.

Ich habe online gesucht und Lösungen gepostet, aber keine scheint zu funktionieren.

Demo: http://jsfiddle.net/hozefa/8fv6e/

CSS:

#imageURLId{
font-size: 14px;
font-weight: normal;
resize: none;
overflow-y: scroll;
}

HTML:

<label for="aboutDescription" id="aboutHeading">About</label>
<textarea rows="15" cols="50" id="aboutDescription"
    style="resize: none;"></textarea>
<a  id="imageURLId" target="_blank">Go to
    HomePage</a>

Sie verwenden jQuery Mobile. Bildlaufleisten sind meiner Meinung nach auf Mobiltelefonen (insbesondere berührungsempfindlich) etwas nervig.

– Didier Ghys

20. Dezember 2011 um 20:26 Uhr

Royi Namir

Versuche dies. Es ist eine andere Version der Antworten.

#imageURLId {
  font-size: 14px;
  font-weight: normal;
  resize: none;
  overflow-y: scroll;
}

<label for="aboutDescription" id="aboutHeading">About</label>
<textarea rows="15" cols="50" id="aboutDescription" style="max-height:100px;min-height:100px; resize: none"></textarea>
<a id="imageURLId" target="_blank">Go to
    HomePage</a>

Mike Christensen

Sie können versuchen, Folgendes hinzuzufügen:

#aboutDescription
{
    height: 100px;
    max-height: 100px;  
}

@MikeChristensen: Safari 5.1.2 (Mac OS)

– Hozefa

20. Dezember 2011 um 19:50 Uhr
@MikeChristensen: Das Ändern in #aboutDescription funktioniert. Ich habe einen dummen Fehler gemacht. Danke für die Hilfe.

– Hozefa

20. Dezember 2011 um 19:52 Uhr
@Hozefa – Freut mich zu hören. Ich bin mir nicht sicher, ob Sie 15 Zeilen verwenden, aber keine Größenänderung zulassen möchten. Ich bin mir nicht sicher, ob Sie das tun können. Ohne eine feste CSS-Höhe scheint es sich sogar mit der Größe nach Bedarf anzupassen resize:none; – Ich nehme an, Sie müssten Ihre Zeilenhöhe in Pixel umwandeln.

– Mike Christensen

20. Dezember 2011 um 19:55 Uhr
Stellen Sie sicher, dass Sie nicht den Stil white-space:nowrap in Ihrem Textbereich aufgreifen. Möglicherweise möchten Sie es explizit auf white-space:normal setzen.

– Bonnville

22. April 2015 um 16:10 Uhr

Einfach ändern

<textarea rows="15" cols="50" id="aboutDescription"
style="resize: none;"></textarea>

<textarea rows="15" cols="50" id="aboutDescription"
style="resize: none;" data-role="none"></textarea>

dh hinzufügen:

data-role="none"

Hier ist Ihr CSS

element{
  width: 200px;
  height: 300px;
  overflow-y: auto;
}

Bernat

Vielleicht ein fester height und overflow-y: scroll;

10177300cookie-checkVertikales Scrollen im Textbereich aktivieren

#CSS #html