Comment puis-je déterminer si le contenu du texte déborde d'un élément DIV en JavaScript ?

Détection du débordement vertical dans un élément DIV

Déterminer si le contenu du texte vertical d'un élément DIV dépasse ses limites peut être essentiel pour maintenir l'intégrité de l'interface. Pour détecter ce débordement, une comparaison entre les propriétés scrollHeight et clientHeight d'un élément est recommandée.

Implémentation :

Considérez le code HTML et CSS suivant :

<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>

<code class="css">div.rounded {
  background-color: #FFF;
  height: 123px;
  width: 200px;
  font-size: 11px;
  overflow: hidden;
}</code>

Pour détecter un débordement, insérez le code JavaScript fourni ci-dessous dans la page :

<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>

Lorsque cette fonction est exécutée et qu'une alerte apparaît, la comparaison des valeurs scrollHeight et clientHeight indiquera si le le texte déborde du DIV.

Ressources supplémentaires :

Pour plus d'informations sur ce sujet, veuillez vous référer à l'URL suivante :
http://help.dottoro .com/ljbixkkn.php

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!