soteropolitano, viciado em tecnologia, games e afins.
Dando uma estudada para uma necessidade de um projeto, desenvolvi uma função simples em PHP para utilizar o serviço de encurtador de url bit.ly.
Já tem um tempo que o Adalberto Pita (@adalbertopita) procura uma solução para fazer efeito over utilizado na Globo.com. Passe o mouse em cima de qualquer imagem e veja que o efeito é colocado por cima da imagem e não do lado como seria o padrão.
<ul>
<li><img src="sua-imagem.jpg" alt="" />
<span class="detalhe">seu texto aqui</span>
</li>
</ul>
ul {margin:0; padding:0;}
ul li {list-style:none; position:relative; width:100px; height:100px;}
ul li span {position:absolute; display:block; top:0; left:0; opacity:0; width:90px; height:90px; transition:all 500ms ease-in; -webkit-transition:all 500ms ease-in; -moz-transition:all 500ms ease-in; -o-transition:all 500ms ease-in;border:5px solid #900}
ul li:hover span {cursor:pointer; opacity:0.9}
Com a nova propriedade transition do CSS3 podemos fazer várias efeitos bacanas sem a necessidade de recorrer aos diversos framework's javascript (jQuery, Mootools etc...). Para entender melhor sobre a propriedade recomendo ler CSS3 Transitions ( W3C School, claro!! ) e o artigo bem legal da galera do Nettuts+
<ul>
<li>Menu 1</li>
<li>Menu 2</li>
<li>Menu 3</li>
<li>Menu 4</li>
</ul>
ul, li {
margin:0;
padding:10px 5px;
}
li {
margin-bottom:5px;
padding-bottom:3px;
}
li a {
color:#000;
text-decoration:none;
transition: color 1s ease-in; /*padrão*/
-webkit-transition:color 1s ease-in; /*chrome & safari*/
-moz-transition: color 1s ease-in; /*firefox*/
-o-transition: color 1s ease-in; /*opera*/
}
li a:hover {
color:#C00
}
Para os apressados em conhecer o novo visual do YouTube, segue a dica:
Para quem não usa o Dashboard no Mac OS X, segue uma dica muito simples de como desabilitar o recurso.
defaults write com.apple.dashboard mcx-disabled -boolean YES
killall Dock
Infográfico desenvolvid pela Vitamintalent, contando um pouco da história do Web Standards.
Já tinha lido semana passada que a Google já estava trabalhando no visual do Google Reader. Parece que os rumores foram oficializados hoje.
Com visual mais "clean", o GReader segue a tendências de visual já apresentada em outros serviços da empresa (Google Docs, Gmail, Calendar etc...), só estava faltando o leitor de feeds.
Listagens dos feeds
Umas das mudanças que notei logo de cara é que agora não existe mais a opção de compartilhar um artigo (o velho Share Item). Agora tudo é compartilhado para a rede social da empresa, o Google +.
Leitura dos posts
Depois de um tempo parado, o Read It Later mostrou que a equipe de desenvolvimento não deixou os usuários na mão. Pra quem não conhece, o Read It Later é um serviço de bookmarks, aonde pode salvar sites, notícias para uma leitura mais tarde (o nome já explica tudo).
