JQuery - jQuery no carga correctamente

   
Vista:
Imágen de perfil de santi

jQuery no carga correctamente

Publicado por santi (40 intervenciones) el 04/09/2017 17:50:20
Buenas,

tengo un problemilla con la carga de jQuery, os cuento:

Tengo un div de 80px por 80px y dentro una imagen pero no necesariamente con esas medidas. Lo que hago con JQuery es decirle: Si la imagen tiene más altura que anchura añade una clase, si es más ancha que alta añade otra y si tiene las mismas medidas tanto de alto como de bajo pues otra.

Cuando entro en la página por primera vez se pasa por el for la que es más ancha que alta porqué la centro dentro del div con un overflow:hidden restandole a la izquierda esos píxeles que me sobran, no se si me explico..

Lo que pasa es que cuando vuelvo a cargar la página funciona correctamente y no se porque sucede. He probado añadiendo el jQuery en el header, el script en el header o footer o en la misma página y siempre pasa lo mismo.

Adjunto imagen como ejemplo.

A ver si alguien tiene alguna solución,

Gracias!! ;)
ejemplo
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

jQuery no carga correctamente

Publicado por Yamil Bracho (7 intervenciones) el 04/09/2017 18:11:13
Debes redimensionar el div despues que se termine de cargar todo el DOM. Esto lo haces en el evento ready de JQuery

$(document).ready(function(){
...
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de santi

jQuery no carga correctamente

Publicado por santi (40 intervenciones) el 04/09/2017 18:26:54
Si lo se, eso es lo que me preocupa...

Lo he añadido tanto con:

1
2
$(document).ready(function);
jQuery(document).ready(function($));
o
1
2
$(function(){});
jQuery(function(){});

Pero nada..

Solo pasa con llas imágenes que son más anchas, que lo que hago es restarle píxels a la izquiera.

Este es mi código:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
jQuery(document).ready(function($) {
  //item image
  var imgV = $('img.img-vs');
  imgV.each(function(){
    var img = $(this);
    var widthV = img.width();
    var heightV = img.height();
    if(widthV > heightV){
      img.addClass('img-vs-w');
      img.css('left', - $(this).width() + $(this).width() / 2 + 37); // <-- este es el que falla pero al recargar la página funciona
    }
    if(widthV < heightV){
      img.addClass('img-vs-h');
    }
    if(widthV == heightV){
      img.addClass('img-vs-ecual');
    }
  });
});

Puede que sea porque está dentro de un each y puede que no le de tiempo, no se..
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

jQuery no carga correctamente

Publicado por Horroroso (53 intervenciones) el 06/09/2017 20:27:13
No me queda claro lo que necesitas, pero podrias verificar si no necesitas que la posicion sea relativa:

1
img.css("position", "relative");

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de santi

jQuery no carga correctamente

Publicado por santi (40 intervenciones) el 08/09/2017 16:24:34
Voy a probarlo @Horroroso añadiendo una posición absoluta,

gracias ;)
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Revisar política de publicidad