Obtenir les pourcentages de défilement avec JavaScript

La fonction scrollPercent() permet d'obtenir les pourcentages des défilements verticaux et horizontaux de la page ou d'un élément HTML.

scrollPercent()

Retourne un objet contenant les pourcentages des défilements verticaux et horizontaux d'un élément HTML.

Syntaxe

scrollPercent(element);

Paramètre

element(Node)

Le paramètre element de la fonction scrollPercent() définit l'élément HTML pour lequel obtenir les pourcentages des défilements.
Si ce paramètre est omis, l'élément racine du document HTML sera utilisé par défaut.

Valeur de retour(Objet)

La valeur de retour de la fonction scrollPercent() est un objet dont les propriétés définissent les pourcentages des défilements verticaux et horizontaux d'un élément HTML.

Propriétés

top(Number)

La propriété top de la valeur de retour définit le pourcentage de défilement vertical d'un élément HTML.

left(Number)

La propriété left de la valeur de retour définit le pourcentage de défilement horizontal d'un élément HTML.

var element = document.documentElement;

scrollPercent(element);

// renvoie par exemple : {
//   top: 90,
//   left: 0
// }

function scrollPercent(n) {
  n = n || document.documentElement;
  var y = Math.round(n.scrollTop / (n.scrollHeight - n.clientHeight) * 100),
      x = Math.round(n.scrollLeft / (n.scrollWidth - n.clientWidth) * 100);
  return {
      top: isNaN(y) ? 0 : y,
      left: isNaN(x) ? 0 : x
  };
}