RubyConf Brasil by Locaweb

O Rails Summit Latin America recebeu um upgrade e a partir deste ano se chamará RubyConf Brasil by Locaweb. Depois de duas edições de sucesso, conseguimos a permissão da RubyCentral para a utilização do nome e o apoio de conteúdo deles.

É uma grande conquista para o Brasil, que representará a América Latina recebendo esse evento conhecido mundialmente.

As novidades não param por ai. O evento deste ano será ainda maior, com o mesmo conteúdo de qualidade, palestrantes nacionais e internacionais e o melhor de tudo, custará menos da metade do preço.

Será somente R$150,00 para quem fizer a inscrição e pagamento nos primeiros dias.

Fiquem atentos. Em agosto abriremos as inscrições.

Data: 26 e 27/10/2010
Local: Centro de Convenções Frei Caneca

Mais informações acesse: http://www.rubyconf.com.br

How JavaScript Works

Breve e útil apresentação sobre a linguagem JavaScript.

Bordas arredondadas com jQuery e CSS

Esse é um exemplo simples e prático de como simular bordas arredondadas em imagens utilizando jQuery e CSS. Não existe nenhum mistério, basta criar uma imagem com os 4 cantos arredondados, alguns estilos CSS e um simples script em jQuery, olha só que moleza :)

border-radius

Veja o exemplo

Bordas
Para dar um efeito mais real, eu aconselho usar um .png ou .gif transparente para suavizar as bordas. Aqui estou usando png com bordas de 3px. Faça o download do PNG.

CSS

.bri {
 position:relative;
}
.bri span {
 background:url("borders.png") no-repeat;
 display:block;
 height:3px;
 position:absolute;
 width:3px;
}
.bri .ctl {
 left:0;
 top:0;
}
.bri .ctr {
 background-position:-3px 0;
 right:0;
 top:0;
}
.bri .cbl {
 background-position:0 -3px;
 bottom:0;
 left:0;
}
.bri .cbr {
 background-position:-3px -3px;
 bottom:0;
 right:0;
}

jQuery

$(document).ready(function(){
 $(".border-radius").each(function(i){
 $(this).wrap("<div id='bri"+i+"' class='bri'>").before("<span class='ctl'></span><span class='ctr'></span><span class='cbl'></span><span class='cbr'></span>");
 $('#bri'+i).css({position:'relative', width:$(this).attr('width'), height:$(this).attr('height')});
 })
});

HTML
Basta incluir uma class=”border-radius” na imagem que você quer aplicar o efeito, não esqueça de definir o width/height.

<img class="border-radius" src="imagem.jpg" width="380" height="167">

Funcionou nos seguintes nos navegadores:

  • IE 7, IE8, Chrome, Safari, Firefox e Opera (Win)
  • Firefox, Safari, Chrome, Opera (Mac)
  • Firefox, Chrome, Opera (Linux)

Se tiver alguma dúvida poste seu comentário.

12º Encontro Locaweb!


12º Encontro Locaweb de Profissionais
A Locaweb chegou a décima segunda edição do Encontro Locaweb de Profissionais de Internet, o evento que já se tornou uma referência no Brasil.

Mais de 6.000 pessoas já tiveram a oportunidade de participar deste encontro, e você não pode ficar de fora dele. Venha conferir as tendências do mercado, atualizar seus conhecimentos e fazer novos contatos. A programação apresenta renomados profissionais, cases, conhecimentos técnicos, informações e muito mais.

http://www.locaweb.com.br/encontro/