Interação
Design Responsivo

Redimensione

Informação

Design Responsivo.

HTML/CSS + media queries Este é um experimento simples com técnicas de design idealizado por James Mellers.

Redimensione seu navegador para revelar diversos tipos de dispositivos. Cada dispositivo aqui lustrado é processado usando código HTML. Isto é possível usando mediaqueries para aplicar diferentes regras CSS para diversos tamanhos de telas.

Scripts utilizados: prefixfree por Lea Verou e css3-mediaqueries-js por Wouter van der Graaf.
Nenhum script é necessário para criar esse exemplo, mas eles ajudam mantendo o suporte ao navegador o mais amplo possível.

 

Esta é uma interação que responde a alterações no tamanho da janela do navegador. Se você está vendo em um dispositivo portátil moderno você pode mudar a sua orientação (retrato / paisagem) para ver um exemplo básico em funcionamento.
A ilustração deve girar para coincidir com a nova orientação. Para a experiência completa por favor veja essa página com um navegador redimensionável.