Román Cortés

Fit and Shrink Technique

11 de Abril del 2010

Here it is my latest CSS collaboration with Stu Nicholls: http://www.cssplay.co.uk/menu/fast.html

I had the idea for a pure CSS “content overflow detection” and coded it fast just to see if it would work, and it did work. So, I contacted Stu Nicholls from CSSplay to see if we could work together on an useful demo for the just discovered technique, and we have finished for the images “Fit and Shrink Technique” as Stu has finally named it. I’m always proud of collaborating with Stu, the king of CSS :)

 Tuve la idea de un “detector de overflow de contenido” en CSS puro. Es decir, algo que me permitiese realizar algún tipo de acción con CSS cuando el contenido de una página o de un div es mayor de determinadas dimensiones. Probé si mi idea podía funcionar, y lo hizo, así que contacté con Stu Nicholls para mostrárselo y ver si podíamos hacer juntos alguna demo útil con esta técnica. Lo que hemos hecho es un código que permite redimensionar una imagen de forma inteligente a unas dimensiones dadas, sólo con CSS y sin necesidad de Javascript o redimensionado vía servidor. Lo que hace es que dado un hueco con determinado alto y ancho para colocar una imagen (por ejemplo, 200×200 píxeles), si la imagen es más pequeña de dicho tamaño, se muestra centrada y si es más larga o ancha, se redimensiona manteniendo las proporciones.

 Sólo agregar que siempre es un placer y me siento honrado de poder collaborar con Stu. Él es el rey del CSS.

Un comentario RSS

Comentar