<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Codigo Manso &#187; aspect ratio</title>
	<atom:link href="http://www.codigomanso.com/es/tag/aspect-ratio/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.codigomanso.com</link>
	<description>Programación, informática y tecnología</description>
	<lastBuildDate>Sun, 21 Aug 2011 10:54:29 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Escalar una imagen manteniendo el aspecto</title>
		<link>http://www.codigomanso.com/es/2009/03/escalar-una-imagen-manteniendo-el-aspecto/</link>
		<comments>http://www.codigomanso.com/es/2009/03/escalar-una-imagen-manteniendo-el-aspecto/#comments</comments>
		<pubDate>Fri, 27 Mar 2009 20:10:52 +0000</pubDate>
		<dc:creator>Pau Sanchez</dc:creator>
				<category><![CDATA[General]]></category>
		<category><![CDATA[aspect ratio]]></category>
		<category><![CDATA[aspecto]]></category>
		<category><![CDATA[escalar]]></category>
		<category><![CDATA[imagenes]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[PHP]]></category>

		<guid isPermaLink="false">http://www.codigomanso.com/es/?p=621</guid>
		<description><![CDATA[Muchas veces es necesario escalar una imagen para que se mantenga dentro de unos límites y pueda visualizarse correctamente. Es mucho mejor si la imagen no se deforma. En estos casos hay que hacer un escalado manteniendo el aspect ratio.
Hoy día hay cientos de librerias para cualquier lenguaje que realizan un escalado. La única pregunta [...]]]></description>
			<content:encoded><![CDATA[<p>Muchas veces es necesario escalar una imagen para que se mantenga dentro de unos límites y pueda visualizarse correctamente. Es mucho mejor si la imagen no se deforma. En estos casos hay que hacer un escalado manteniendo el aspect ratio.</p>
<p>Hoy día hay cientos de librerias para cualquier lenguaje que realizan un escalado. La única pregunta es, ¿cuales deben ser el nuevo ancho y largo de la imagen?</p>
<p>A continuación el código mágico que está probado en javascript, pero que debe funcionar en PHP, python, java, perl, C, y lo que le pongas por delate <img src='http://www.codigomanso.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>w <span style="color: #339933;">&lt;</span> h<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
  h <span style="color: #339933;">=</span> <span style="color: #009900;">&#40;</span>h <span style="color: #339933;">*</span> maxWidth<span style="color: #009900;">&#41;</span> <span style="color: #339933;">/</span> w<span style="color: #339933;">;</span>
  w <span style="color: #339933;">=</span> maxWidth<span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #000000; font-weight: bold;">else</span> <span style="color: #009900;">&#123;</span>
  w <span style="color: #339933;">=</span> <span style="color: #009900;">&#40;</span>w <span style="color: #339933;">*</span> maxHeight<span style="color: #009900;">&#41;</span> <span style="color: #339933;">/</span> h<span style="color: #339933;">;</span>
  h <span style="color: #339933;">=</span> maxHeight<span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></div></div>

<p><b>w</b> representa el ancho o width de la imagen</p>
<p><b>h</b> representa el alto o height de la imagen</p>
<p><b>maxWidth</b> la anchura máxima del área en la que se quiere meter la imagen</p>
<p><b>maxHeight</b> la altura máxima del área en la que se quiere meter la imagen</p>
<p>Como ejemplo final, aunque es prácticamente copy paste, imaginad que quereis meter una imágen de tamaño (w, h) en un área de 640&#215;480:</p>
<pre lang=java">
var maxWidth = 640, maxHeight = 480;
if (w > maxWidth || h > maxHeight) {
  if (w < h) {
    h = (h * maxWidth) / w;
    w = maxWidth;
  }
  else {
    w = (w * maxHeight) / h;
    h = maxHeight;
  }
}
</pre>
]]></content:encoded>
			<wfw:commentRss>http://www.codigomanso.com/es/2009/03/escalar-una-imagen-manteniendo-el-aspecto/feed/</wfw:commentRss>
		<slash:comments>37</slash:comments>
		</item>
	</channel>
</rss>

