jQuery – Détecte si la hauteur de l’élément est supérieure à la hauteur de la fenêtre et fait quelque chose à ce sujet

Le titre dit vraiment tout.

En gros, je veux détecter si la height cette div est plus grande que la height window et faire quelque chose à ce sujet ..

J’ai fait cela, mais je ne peux pas le faire fonctionner http://jsfiddle.net/dhkCa/3 Pourquoi cela ne fonctionne-t-il pas?

Edit: Correction d’une petite erreur dans le code CSS. Le lien Jsfiddle a été mis à jour.

Le document contient tous les éléments qu’il contient, et sa hauteur est la sum des hauteurs de tous ces éléments (tout l’ display:block éléments de display:block toute façon, plus marge et remplissage); par conséquent, aucun élément contenu ne peut être plus grand que le document lui-même. Ce que vous devez faire, c’est comparer la hauteur de la window , pas celle du document:

 var div = $("div").height(); var win = $(window).height(); if (div > win ) { $("div").addClass('red'); } 

Démo de JS Fiddle .

Pour un élément dont la hauteur de défilement est différente de celle du document, vous pouvez utiliser element.getBoundingClientRect().height (Docs) .