0

Saludos.Tengo este jquery que asigna el height a un div con relacion a una imagen hija

$(window).load(function(){
var alto = $('#bigPic img').height(); //alto de la imagen
$('#bigPic').height(alto * 1.1); }); //alto div = alto imagen * 1.1

Y esta que cambia la altura del div con relacion a la misma imagen unicamente cuando cambia tamaño de la ventana (no al cargar la pagina)

$(window).resize(function () {
$('#bigPic').height($('#bigPic img').height() * 1.1);});
$(window).trigger('resize');

Como haría para que fusionar las dos funciones o que la resize funcione al también al cargar la pagina. Muchas gracias.

Imgen pre y pos

Daniel
  • 409
  • 1
  • 8
  • 17
  • ¿Quieres que todo se ejecute al cargar la página? Puedes probar moviendo el código de tu función `resize` adentro del `load` – Yikarus May 26 '17 at 16:17
  • Gracias por tu respuesta. necesito que el div tenga cierta altura con relación la altura de una imagen hija, al cargar lo consigo con la primera, y al ser resposive lo consigo con resize. la resize me sirve pero por si sola al cargar la pagina la altura del div no es el deseado solo cuando cambia el tamaño de la ventana es que me sirve. lo probare – Daniel May 26 '17 at 16:25

1 Answers1

1

Crea una función:

var resize_ = function () {
    var alto = $('#bigPic img').height(); //alto de la imagen
    $('#bigPic').height(alto * 1.1); }); //alto div = alto imagen * 1.1
}

Luego la invocas en donde la necesites:

var resize_ = function () {
        var alto = $('#bigPic img').height(); //alto de la imagen
        $('#bigPic').height(alto * 1.1); //alto div = alto imagen * 1.1
    }

  $( window ).on( "load", function() {
    alert("paso");
    resize_ (); 
  });

$(window).resize(function() {
    resize_ ();
});

Asi la funcion resize, te funciona en los dos eventos que es lo que preguntas.

Saludos,

Jorge Londoño
  • 964
  • 1
  • 5
  • 14
  • Gracias, fue muy útil – Daniel May 26 '17 at 20:32
  • Jorge tengo un script de un chat de smartsupp que tarda algo en cargar, y la funcion se ejecuta despues que carga todo, como podria que para que se ejecute antes de el smartsupp. estoy usando $( document ).ready() pero como que algo hago mal. se podría corregir ? – Daniel May 27 '17 at 01:57
  • Agrega la pregunta, documentala bien y te ayudo – Jorge Londoño May 27 '17 at 01:58
  • Muchas gracias por responder, estaba leyendo esta respuesta [https://es.stackoverflow.com/questions/51946/cu%C3%A1l-es-la-diferencia-entre-window-onload-y-document-ready] y creo que es mejor dejarlo así, lo del script que te comente genera confusión. lo anterior que te consulté es que hasta que no carga el ultimo elemento de window **pre** (como una imagen muy pesada que no tiene que ver con lo de la función) no se calcula el alto div. **post** reitero, las gracias por tu ayuda ya me has ayudado mucho – Daniel May 27 '17 at 03:02