Pregunta

Estoy tratando de hacer posicionamiento en JavaScript.Estoy usando un acumulada de la función de posición basado en la clásico de quirksmode función que las sumas offsetTop y offsetLeft para cada offsetParent hasta el nodo superior.

Sin embargo, estoy corriendo en un problema donde el elemento que me interesa no tiene offsetParent en Firefox.En IE offsetParent existe, pero offsetTop y offsetLeft todo suma a 0, de manera que tiene el mismo problema, en efecto, como en Firefox.

Lo que haría un elemento que es claramente visible y utilizable en la pantalla para no tener un offsetParent?O, más concretamente, ¿cómo puedo encontrar la posición de este elemento con el fin de colocar un desplegable debajo de ella?

Editar:He aquí cómo reproducir un ejemplo particular de este (no resuelto por la actualmente aceptada por la respuesta):

  1. Abra el página de inicio de Desbordamiento de Pila.
  2. Ejecute el código siguiente en la Consola del navegador web (por ejemplo,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
    

¿Por qué es el offsetParent de que elemento null?

¿Fue útil?

Solución

Si el documento no ha terminado de cargarse, offsetParent puede ser nulo

Otros consejos

He hecho una prueba de 2,304 divs con combinaciones únicas de valores para position, display, y visibility, anidado en el interior de combinaciones únicas de cada uno de esos valores, y se determinó que:

un-elemento válido
que es un descendiente de <body>
no tendrá un offsetParent valor si:

  • El elemento tiene position:fixed (Webkit y IE9)
  • El elemento tiene display:none (Webkit y FF)
  • Cualquier antepasado ha display:none (Webkit y FF)

También es razonable esperar que un elemento que no tiene padre, o que no se agrega a la página en sí (no es un descendiente de la <body> de la página), también tendrá offsetParent==null.

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

offsetParent devuelve nulo cuando el elemento tiene style.display establecido en " none " ;.

offsetParent devolverá nulo si su objeto elemento aún no se ha agregado al DOM.

Esta es una vieja pregunta, pero tengo otro caso. Si manipula el DOM, puede terminar con un offsetParent nulo, en IE6 e IE7.

Ver: IE 6/7 - " Error no especificado " al acceder a offsetParent (Javascript)

Me he encontrado con este problema cuando el hermano a la izquierda del elemento está oculto:

<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>

Me he encontrado con el caso donde el offsetParent del element3 es nulo a pesar de que el element3 es visible y padre es visible.

He visto que es delgado es Firefox 3.6 y Chrome 5. Parece que también afecta la función getBoundingClientRect () en el element3 , lo cual es realmente molesto ya que funciona en tantos otros casos!

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top