Wie kann JavaScript einen Überlauf von HTML-Elementinhalten erkennen, wenn „Überlauf: sichtbar' ist?

So erkennen Sie einen Elementinhaltsüberlauf in HTML mit JavaScript

Sie sind auf ein HTML-Element gestoßen, das trotz seiner Überlaufeigenschaft überlaufenden Inhalt aufweist auf „sichtbar“ eingestellt und es fehlen Bildlaufleisten. Gibt es eine Möglichkeit, mithilfe von JavaScript festzustellen, ob dieser Überlauf vorliegt?

Behebung des Problems

Normalerweise vergleicht man clientHeight und scrollHeight (oder clientWidth und scrollWidth) des Elements. Überlauf zu erkennen. Allerdings stellt ein Überlauf mit der Einstellung „sichtbar“ eine Herausforderung dar.

Lösung: Überlaufeigenschaft vorübergehend ändern

Um dies zu berücksichtigen, ist eine Erkennungsroutine erforderlich. Die folgende Funktion ändert den „Überlauf“-Stil vorübergehend in „versteckt“ und prüft auf Überlauf:

function checkOverflow(el) {
   var curOverflow = el.style.overflow;

   if ( !curOverflow || curOverflow === "visible" ) {
      el.style.overflow = "hidden";
   }

   var isOverflowing = el.clientWidth < el.scrollWidth || el.clientHeight < el.scrollHeight;

   el.style.overflow = curOverflow;

   return isOverflowing;
}

Unterstützte Browser

Diese Funktion wurde auf Firefox 3 getestet , Firefox 40.0.2, Internet Explorer 6 und Chrome 0.2.149.30.

Das obige ist der detaillierte Inhalt vonWie kann JavaScript einen Überlauf von HTML-Elementinhalten erkennen, wenn „Überlauf: sichtbar' ist?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!