img - onload jquery div

window.onload vs document.ready jQuery

Question

Tengo un sitio con dos columnas. Quiero tener la misma altura en ambos usando jQuery.

Estoy tratando de obtener la altura de la columna logotipo. Tuve:

$(document).ready(function() {
    alert($(''#logo'').height());
});​

y no funcionó. Así que lo cambié a:

window.onload = function(){
    alert($(''#logo'').height());
}

Y está funcionando. ¿Qué está pasando aquí?

Answer 1

Tuve un mismo problema al manejar la altura y el ancho de la imagen dentro de $ (documento) y encontré algunas mejores referencias para resolverlo ... Espero que esto pueda ayudar a alguien

$ (documento) .ready ()

El evento de documento listo se activa cuando el documento HTML se carga y el DOM está listo, incluso si todos los gráficos aún no se han cargado. Si desea conectar sus eventos para ciertos elementos antes de que se cargue la ventana, $ (documento) .ready es el lugar correcto.

Código:

$(document).ready(function() {
    // document is loaded and DOM is ready
    alert("document is ready");
});

$ (ventana) .load ()

El evento de carga de la ventana se activó un poco más tarde, cuando la página completa está completamente cargada, incluidos todos los marcos, objetos e imágenes. Por lo tanto, las funciones relacionadas con imágenes u otros contenidos de la página se deben colocar en el evento de carga para la ventana o la etiqueta de contenido en sí.

Código:

$(window).load(function() {
    // page is fully loaded, including all frames, objects and images
    alert("window is loaded");
});

Answer 2

document ready se activa cuando el DOM se ha cargado, por lo que la información como la altura no está disponible, a menos que se declare explícitamente.

window onload espera a que los recursos en la página se carguen completamente, por lo que ahora está disponible información como la altura.