So ermitteln Sie mithilfe von JS, ob die Seite über Bildlaufleisten verfügt

Kürzlich musste ich beim Schreiben eines Plug-Ins JS verwenden, um festzustellen, ob eine Bildlaufleiste vorhanden ist. Nach der Suche sind die allgemeinen Methoden ähnlich, aber sie sind etwas ausführlich und der Code ist nicht prägnant genug. Schließlich habe ich unter Bezugnahme auf verschiedene Methoden eine relativ einfache Methode geschrieben

Vorwort

Vor kurzem musste ich beim Schreiben eines Plug-Ins JS verwenden Stellen Sie fest, ob eine Bildlaufleiste vorhanden ist. Nach einer Weile sind die allgemeinen Methoden ähnlich, aber sie sind etwas ausführlich und der Code ist nicht prägnant genug. Schließlich habe ich eine relativ einfache Methode geschrieben, indem ich mich auf verschiedene Methoden bezog. Bei der Beurteilung der Bildlaufleiste müssen Sie auch die Breite der Bildlaufleiste berechnen, die ich Ihnen in diesem Artikel mitteilen werde.

Warum sollten wir die Bildlaufleiste beurteilen?

Die Notwendigkeit, die Bildlaufleiste zu beurteilen, wird häufig in Popup-Fenster-Plug-Ins verwendet, da die meisten Pop-up-Fenster verwendet werden -up Windows fügt das Attribut overflow: hidden hinzu. Wenn die Seite relativ lang ist, wackelt die Seite nach dem Hinzufügen dieses Attributs.

Um das Benutzererlebnis zu verbessern, wird das Attribut margin-left hinzugefügt, um die Position der Bildlaufleiste nach overflow: hidden zu versetzen, indem bestimmt wird, ob eine Bildlaufleiste vorhanden ist.

So ermitteln Sie, ob eine Bildlaufleiste vorhanden ist

Tatsächlich ist nur eine Zeile JS erforderlich. Der Test ist mit IE7 kompatibel

function hasScrollbar() {
  return document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight);
}

Unter normalen Umständen können Sie document.body.scrollHeight > verwenden. window.innerHeight

window.innerHeight . Um also mit IE7 und IE8 kompatibel zu sein, müssen Sie das Attribut underfined verwenden, um die Fensterhöhe zu berechnen. document.documentElement.clientHeight

Die Methode zur Berechnung der Breite der Bildlaufleiste

-Wert hinzu. margin-left

und < des Elements 🎜> Erhalten, ich werde aus der Methode lernen in offsetWidth clientWidth Magnific-popup

function getScrollbarWidth() {

  var scrollp = document.createElement("p");
  scrollp.style.cssText = 'width: 99px; height: 99px; overflow: scroll; position: absolute; top: -9999px;';
  document.body.appendChild(scrollp);
  var scrollbarWidth = scrollp.offsetWidth - scrollp.clientWidth;
  document.body.removeChild(scrollp);

  return scrollbarWidth;

}

Das Obige ist, was ich für alle zusammengestellt habe. Ich hoffe, es wird für alle hilfreich sein in der Zukunft.

Verwandte Artikel:

Das obige ist der detaillierte Inhalt vonSo ermitteln Sie mithilfe von JS, ob die Seite über Bildlaufleisten verfügt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!