Erreur : getBoundingClientRect of null
Bonjour
J'essaie de faire une barre de navigation "intelligente" c'est à dire que quand un lien n est plus affiché, le bouton menu apparait.
tous ces liens ont un id "DivLG" immédiatement suivi d un chiffre (de 1 à 6 dans mon cas).
Je teste cela lors du resize (dans la balise body) de la page.
Avec ce code je teste individuellement la visibilité d un lien, tout va bien, la fonctionne ne présente aucune erreur.
Code:
1 2
| var test = isElementVisible("DivLG1");
alert(test) |
Mais si j'appelle isElementVisible dans un boucle, j ai l erreur suivante Uncaught TypeError: Cannot read property 'getBoundingClientRect' of null
at isElementVisible (index2.html:240) qui correspond à la ligne var rect = div.getBoundingClientRect(), dans ma fonction.
J ai besoin de vos lumières
merci pour votre aide
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37
| function CheckResize() {
var sw_temp = window.innerWidth;
if (sw_temp > 576 ) {
for (var i = 6; i >= 2; i--) {
var idx = "DivLG"+i;
alert(idx);
if (!isElementVisible(idx)) {
alert(idx+" pas visible");
document.getElementById("bt-menu").style.display = "block";
}
else
{
alert(idx+" visible");
document.getElementById("bt-menu").style.display = "none";
}
}
}
}
function isElementVisible(el) {
var div = document.getElementById(el);
var rect = div.getBoundingClientRect(),
vWidth = window.innerWidth || document.documentElement.clientWidth,
vHeight = window.innerHeight || document.documentElement.clientHeight,
efp = function(x, y) {
return document.elementFromPoint(x, y)
};
if (rect.right < 0 || rect.bottom < 0 ||
rect.left > vWidth || rect.top > vHeight)
return false;
return (
div.contains(efp(rect.left, rect.top)) ||
div.contains(efp(rect.right, rect.top)) ||
div.contains(efp(rect.right, rect.bottom)) ||
div.contains(efp(rect.left, rect.bottom))
);
} |