Qu'est-ce qui rendrait offsetParent nul?

J'essaie de faire du positionnement en JavaScript. J'utilise une fonction de position cumulative basée sur le classic quirksmode function qui résume offsetTop et offsetLeft pour chaque offsetParent jusqu'au nœud supérieur.Qu'est-ce qui rendrait offsetParent nul?

Cependant, je suis confronté à un problème où l'élément qui m'intéresse n'a pas offsetParent dans Firefox. Dans IE offsetParent existe, mais offsetTop et offsetLeft résument tous à 0, de sorte qu'il a le même problème en vigueur que dans Firefox.

Qu'est-ce qui provoquerait un élément clairement visible et utilisable à l'écran pour ne pas avoir un offsetParent? Ou, plus concrètement, comment puis-je trouver la position de cet élément pour y placer une liste déroulante?

Modifier: Voici comment reproduire un cas particulier de ce (non résolu par la réponse actuellement acceptée):

Ouvrez le home page of Stack Overflow.

Exécutez le code suivant dans la console du navigateur Web (par exemple Chromev21):

var e = document.querySelector('div'); 
console.log(e); 
// <div id="notify-container"></div> 
do{ 
    var s = getComputedStyle(e); 
    console.log(e.tagName,s.display,s.visibility,s.position,e.offsetParent); 
} while(e=e.parentElement) 
// DIV block visible fixed null 
// BODY block visible static null 
// HTML block visible static null

Pourquoi le offsetParent de cet élément null?

Source

2008-11-20 Brian Ramsay

Veuillez poster quelques exemples de code. –

Un exemple réel montrant l'élément défectueux aiderait ... – PhiLho

Dans votre cas, c'est à cause de 'position: fixed' - il n'y a pas de parent layout – Bergi

Si le document n'a pas fini de se charger alors offsetParent peut être nul

Source

2008-11-20 18:46:06 Greg

Ceci est une vieille question, mais j'ai une autre affaire. Si vous manipulez le DOM, vous pouvez vous retrouver avec un offsetParent nul - dans IE6 et IE7.

Voir: IE 6/7 - "Unspecified Error" when accessing offsetParent (Javascript)

Source

2010-04-27 23:18:39 Mark

J'ai couru dans ce problème lorsque le frère juste à gauche de l'élément est caché:

<div id="parent"> 
    <div id="element1">some stuff</div> 
    <div id="element2" style="display: none">some hidden stuff</div> 
    <div id="element3">child whose offset we want</div> 
</div>

J'ai couru dans le cas où le offsetParent de L'élément 3 est null même si l'élément 3 lui-même est visible et parent est visible.

Je l'ai vu mince est Firefox 3.6 et Chrome 5. Il semble aussi affecter la getBoundingClientRect() fonction sur la element3, ce qui est vraiment gênant puisque cela fonctionne dans tant d'autres cas!

Source

2010-07-22 20:24:25 Norman

https://developer.mozilla.org/en/DOM/element.offsetParent

offsetParent renvoie null lorsque l'élément a style.display réglé sur "none".

Source

2010-10-06 22:50:14 Ivan

Par ma réponse ci-dessous, j'ai maintenant édité la page MDN pour noter que Il existe d'autres situations pour les navigateurs non-FF qui provoquent également la situation. – Phrogz

offsetParent renverra null si votre objet élément n'a pas encore été ajouté au DOM.

Source

2011-01-15 20:40:08

J'ai fait a test of 2,304 divs avec des combinaisons uniques de valeurs pour position, display et visibility, imbriqué dans des combinaisons uniques de chacune de ces valeurs, et a déterminé que:

un élément autre valide
qui est un descendant de <body>
aura pas une valeur offsetParent si:

L'élément a position:fixed (Webkit et IE9)
L'élément a display:none (Webkit et FF)
Tout ancêtre a display:none (Webkit et FF)

Il est raisonnable de penser qu'un élément qui n'a pas de parent, ou qui n'est pas ajouté à la page elle-même (n'est pas un descendant du <body> de la page), aura également offsetParent==null.

Source

2012-07-24 21:33:54 Phrogz

m'a sauvé, merci! – SeanKendle

Répondre

Questions connexes