Mal implementaram máscaras e gradientes via CSS, os caras do WebKit anunciaram que o sistema de renderização suporta agora também CSS Reflections.
O código base é o seguinte:
-webkit-box-reflect: <direction> <offset> <mask-box-image>
A direção pode ser especificada como above, below, left ou right. Offset é a distância da imagem original para o reflexo, que pode ser omitida, assumindo o valor padrão 0. O terceiro parâmetro é uma imagem de máscara, também opcional.
Quer pirar o cabeção? Os reflexos alteram-se automática e imediatamente junto com a fonte. Isso significa que, se aplicados a um menu com hover, por exemplo, eles se atualizam enquanto o usuário passa o mouse em cima das opções. A propriedade pode ser aplicada até mesmo para vídeos, que são reproduzidos no reflexo em tempo real.
Eu quero! Eu quero!! 😀
