« Mac é Pop no comercial “Lola”, da Coca-Cola Os 25 melhores setups pessoais e profissionais com Macs »

WebKit ganha suporte para reflexos via CSS

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.

Reflexos via CSS

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!! :D

Quem escreve?

Rafael Fischmann

Rafael Fischmann
Graduado em Comunicação Social com Habilitação em Publicidade e Propaganda na Universidade Salvador - UNIFACS, tem paixão pela Apple e seus produtos desde quando adquiriu seu primeiro iMac (um G3 Blueberry), em agosto de 2000. Possui hoje um MacBook Pro de 17 polegadas, um iPod video de 80GB, um iPod shuffle de 2GB e um AirPort Express. Seu mais novo integrante é filho italiano adotado, um iPhone 3G preto.

8 Comentários


  • Frederico Cintra

    Esses códigos serão padronizados para que outros navegadores possam implementar?

    Usando o Mozilla Firefox Mozilla Firefox 2.0.0.14 no Windows Windows XP

  • andré

    esses reflexos, bordas, elementos orgânicos são usados indiscriminadamente e enchem o saco. esse estilo visual web 2.0 já deu o que tinha que dar. eu sou a favor da morte ao reflexo mal usado! e com isso agora mais fácil, creio que qquer mané vai encher seu site horroroso com mil e um reflexos. efeitos são mais facilmente usados para o mal que para o bem.

    Usando o Safari Safari 525.18 no Mac OS Mac OS X

  • Marcus Roberto

    BARALHO!!! Em vídeos também? Nossa senhora, o que vai ter computador popular travando não vai ser brincadeira, heheheh. Muito bom mesmo, hein…

    Usando o Safari Safari 525.17 no Mac OS Mac OS X

  • Celso Dantas

    E q pena q pouca gente usa o safari. =/
    ou os outros navegadores (lê-se principalmente o IE) tb não dão esse gas q nem o safari tá dando.

    Usando o Safari Safari 525.18 no Mac OS Mac OS X

  • Márcio Doratiotto

    É, realmente pc do milhão não vai rodar… mas pensando bem, que sites esse pessoal visita além do Orkut e Hotmail?

    Usando o Mozilla Firefox Mozilla Firefox 3.0b5 no Windows Windows XP

  • Christian

    O importante é se atentar à tecnologia nesse momento. Se vão fazer uso indiscriminado? Os maus designers ou os programadores metidos a designers vão com certeza fazer. Assim como faziam com aqueles efeitos de blink e marquee nos primórdios da web.
    O que importa é que depois de um tempo, os bons trabalhos serão filtrados, e a tecnologia ficará aí disponivel para quem precisar usar.

    Usando o Mozilla Firefox Mozilla Firefox 3.0b5 no Linux Linux

  • Guilherme Serrano

    “o que vai ter computador popular travando não vai ser brincadeira”
    é, quero só ver… haha

    mas a novidade é legal, SE BEM utilizado pode ser muito útil :)

    Usando o Mozilla Firefox Mozilla Firefox 2.0.0.14 no Windows Windows XP

  • Tiago Celestino

    Usando o reflection.js, fica fácil exibir em todos os browsers, agora se bem que os outros navegadores poderiam implementar algo parecido, seria muito mais bacana.

    Usando o Mozilla Firefox Mozilla Firefox 2.0.0.14 no Windows Windows XP

Trackbacks

Trackback URL para este artigo:

http://macmagazine.com.br/blog/2008/04/30/webkit-ganha-suporte-para-reflexos-via-css/trackback/

Deixe um Comentário!

[XHTML] Você pode usar estas tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

[?] Clique aqui para saber como anexar sua foto ao comentário!

Aviso: todo e qualquer texto publicado na internet através deste sistema não reflete, necessariamente, a opinião deste weblog ou de seu(s) autor(es). Os comentários publicados através deste sistema são de exclusiva e integral responsabilidade e autoria dos leitores que dele fizerem uso. O autor deste weblog reserva-se, desde já, o direito de excluir comentários e textos que julgar ofensivos, difamatórios, caluniosos, preconceituosos ou de alguma forma prejudiciais a terceiros. Textos de caráter promocional ou inseridos no sistema sem a devida identificação de seu autor (nome completo e endereço válido de email) também poderão ser excluídos.

« Mac é Pop no comercial “Lola”, da Coca-Cola Os 25 melhores setups pessoais e profissionais com Macs »

del.icio.us

Receba nossas novidades por email

Os artigos do BLOG.MACMAGAZINE são entregues diretamente na sua caixa de entrada!

Hospede seu site na (mt) Media Temple!

Technorati

FeedBurner

Leitores via feed RSS