Pasar al contenido principal
www.keopx.net

Navegación principal

  • Inicio
  • Talks
  • Freelance Drupal Bilbao
  • Acerca de Keopx
  • Contacto
Menú de cuenta de usuario
  • Iniciar sesión

Sobrescribir enlaces de ayuda a la navegación

  1. Inicio

JQuery: Redimesionar imagen sin perder proporción

By keopx, 26 Septiembre, 2009

Con este script basándonos en JQuery nos sera fácil redimensionar una imagen o varias imágenes según las capas aquellas imágenes que superen en x tamaño la anchura. También se puede utilizar la altura como medida pero bueno con unos pequeños ajustes no hay mayores problemas.

jQuery(document).ready(function(){
  jQuery('.content img.imagefield').each(function(){
    var width = jQuery(this).width();
    var new_width = 680; //nuevo tamaño
    if (width > new_width){
      var height = jQuery(this).height();
      var calculo = Math.round((100*new_width)/ width); //porcentaje
      var new_height = Math.round((height*calculo)/100);
      jQuery(this).css( {
        width : new_width+'px',
        height : new_height+'px'
      } );
    }
  });
});

 

Categoria
JavaScript
Tag
JavaScript
jQuery

Comentarios

El contenido de este campo se mantiene privado y no se mostrará públicamente.
Acerca de formatos de texto

HTML Restringido

  • Etiquetas HTML permitidas: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • Saltos automáticos de líneas y de párrafos.
  • Las direcciones de correos electrónicos y páginas web se convierten en enlaces automáticamente.

Forcontu Master in Drupal 9

DrupalAssoc member

DrupalCampSpain2022: Introducción al desarrollo de módulos en Drupal 9

Seville Drupal Developer Days Individual Sponsor - 2017

I am speaker DrupalCamp Alicante 2018

I am speaker DrupalCamp Madrid 2017

I am speaker DrupalCamp Valencia 2014

I am Rules Ruler

Sponsored by

Isarea

Soy Ruben Egiguren a.k.a. keopx, actualmente soy freelance experto en Drupal de Bilbao

  • Reinicializar su contraseña
RSS feed
Powered by www.keopx.net