Heim >Web-Frontend >CSS-Tutorial >Wie erkennt man mit JavaScript einen vertikalen Textüberlauf in einem DIV-Element?

Wie erkennt man mit JavaScript einen vertikalen Textüberlauf in einem DIV-Element?

Barbara Streisand
Barbara StreisandOriginal
2024-10-25 15:50:02706Durchsuche

How to Detect Vertical Text Overflow in a DIV Element using JavaScript?

Überlauferkennung in DIV-Elementen

In diesem Artikel befassen wir uns mit der Frage, wie man einen vertikalen Textüberlauf innerhalb eines DIV-Elements ermitteln kann.

CSS- und HTML-Setup

Berücksichtigen Sie den folgenden CSS- und HTML-Code:

<code class="css">div.rounded {
  background-color: #FFF;
  height: 123px;
  width: 200px;
  font-size: 11px;
  overflow: hidden;
}</code>
<code class="html"><div id="tempDiv" class="rounded">
  Lorem ipsum dolor sit amet,
  consectetur adipiscing elit. Phasellus vel quam vestibulum orci blandit laoreet.
</div></code>

Überlauf erkennen

Um festzustellen, ob der Text des DIV-Elements übergelaufen ist, kann JavaScript dies tun beschäftigt sein. Das folgende Skript vergleicht die scrollHeight des Elements mit seiner clientHeight:

<code class="javascript">function GetContainerSize() {
  var container = document.getElementById("tempDiv");
  var message =
    "The width of the contents with padding: " +
    container.scrollWidth +
    "px.\n";
  message +=
    "The height of the contents with padding: " +
    container.scrollHeight +
    "px.\n";

  alert(message);
}</code>

Durch die Ausführung dieses Skripts können Sie die Abmessungen des DIV-Inhalts einschließlich etwaiger Überläufe ermitteln.

Zusätzliche Ressourcen

Weitere Informationen zu diesem Thema finden Sie hier:

  • [Überlaufdokumentation](http://help.dottoro.com/ljbixkkn.php)

Das obige ist der detaillierte Inhalt vonWie erkennt man mit JavaScript einen vertikalen Textüberlauf in einem DIV-Element?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn