Blog Web Standards

Soluções para os problemas enfrentados pelos desenvolvedores HTML e CSS no dia-a-dia

Última modificação: 31 maio 2011

Em desuso. Esse código está ultrapassado em nosso padrão, então evitamos usá-lo.

Com os recursos que temos atualmente, podemos fazer cantos arredondados diretamente pelo CSS para os browsers Firefox e Safari, graças a propriedades exclusivas de suas engines.

O CSS3 promete unificar tudo isso introduzindo a propriedade border-radius mas, até o momento, a melhor opção que temos é o DD_roundies, um script que possibilita fazermos bordas arredondadas sem imagens para os browsers mais populares: Internet Explorer 6, 7 e 8 além de Firefox e Safari (Google Chrome).
Continuar lendo…

Última modificação: 26 março 2009

Para usar o atributo target="_blank" para que links abram em uma nova janela sem usar window.open() e ainda ter seu XHTML Strict válido, basta incluir o seguinte trecho de código no cabeçalho da sua página:

window.onload = function() {
  var links = document.links;
  for (var i = 0, s = links.length; i < s; i++) {
    if (links[i].rel == 'external') {
      links[i].target = '_blank';
    }
  }
};

Usando jQuery, o trecho de código que deve ser incluído é bem menor:

$(document).ready(function() {
  $('a[rel=external]').attr('target', '_blank');
});

Após usar este script, basta incluir o atributo rel="external" em seus links para que estes abram em nova janela:

&amp;amp;lt;a href=&amp;amp;quot;http://www.webstandards.blog.br/&amp;amp;quot; title=&amp;amp;quot;Melhor blog sobre Web Standards&amp;amp;quot; rel=&amp;amp;quot;external&amp;amp;quot;&amp;amp;gt;Blog Web Standards&amp;amp;lt;/a&amp;amp;gt;

Obs: este script foi escrito por Gustavo Straube.

Última modificação: 25 agosto 2011

Em desuso. Esse código está ultrapassado em nosso padrão, então evitamos usá-lo.

Procurando alguma boa solução para aplicação de transparência alpha do PNG no Internet Explorer 6?

Diversas soluções já foram apresentadas, desde um script que necessitava de um GIF transparente de 1×1 pixel e era aplicável somente às imagens em tags <img>, além de utilizar a propriedade filter direto no CSS, o que costumamos utilizar, pois temos total controle sobre a aplicação da funcionalidade no IE 6.

Porém, tanto esse script como a aplicação direta no CSS usavam o mesmo recurso (AlphaImageLoader Filter) para simular a transparência no Internet Explorer. Então ambos os casos apresentavam as mesmas limitações.

No caso de elementos que necessitavam de um background com o PNG, não poderíamos usar background-position, background-repeat, etc.; recursos fundamentais para aplicação de fundos via CSS, pois neste caso não se trata de um fundo propriamente dito, pois o IE não o interpreta dessa forma.

Então apresentamos a vocês o DD_belatedPNG, a solução definitiva para uso de PNG 24 bits no Internet Explorer 6!

Para utilizá-lo é bastante simples: basta baixar o script (procure mantê-lo atualizado) e usar a classe “.png_bg” (ou qualquer nome que você definir em seu código) nos elementos nos quais o PNG deve ser utilizado.

O ponto mais interessante é que, além da fácil aplicação dessa solução, o script usa outro método para simular a transparência alpha, ao contrário de tudo o que vinha sendo visto até hoje. Desta forma, poderemos utilizar background-position, background-repeat, cliques em links, elementos de formulário, etc., algo impossível de ser feito no Internet Explorer 6 até então.

Exemplo de aplicação

<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script>
<script>
/* Nomeando a classe que definirá quais elementos terão a correção para PNG */
DD_belatedPNG.fix('.png_bg');
</script>
<![endif]-->

Como vocês podem ver a aplicação é bem simples, mas caso haja alguma dúvida é só comentar 🙂

Update: Download atualizado para a versão 0.8a do script.