El código con jQuery es bastante simple:
//incluimos librerías jQuery //capturamos tamaño de ventana var ventana_ancho = $(window).width(); var ventana_alto = $(window).height(); //como la imagen principal mide 480px, regla de tres: var var_mult = (ventana_ancho * 100) / 480; //inicializamos $(document).ready(function() { //el each recorrerá todos los elementos, en este caso div, del documento $("div").each(function(){ //ajustamos alto new_height = ($(this).height() * var_mult)/100; $(this).css( "height", new_height ); //ajustamos ancho new_width = ($(this).width() * var_mult)/100; $(this).css( "width", new_width ); }); });
Con este código recorremos todos los divs dándoles el nuevo tamaño.
Es importante destacar que para que funcione el width y height, de cada uno de nuestros divs, tendría que ir en píxeles ya que es lo que estamos adaptando.
No hay comentarios:
Publicar un comentario