Mas agora a briga é outra. Novos competidores entraram na disputa com a antes solitária vencedora Microsoft e seu odiado – ao menos pela comunidade de desenvolvedores e usuários mais antenados – Internet Explorer.

Entre 1995 e 1999, durante a primeira guerra dos browsers, não existia o Firefox nem o Chrome, do gigante Google. W3C e Padrões Web também não tinham tanta presença na rede, Opera e Safari? Nada disso. A Microsoft reinou absoluta e impôs com sua força de mercado o uso do IE.

Mas um movimento recente vem chamando atenção. Se trata da postura de grandes empresas perante à presença no mercado do arcaico IE6. O Google com o Youtube e o Orkut já deu o aviso de que não dará mais suporte ao IE6. O mesmo fizeram outros grandes sites.

É claro que não é tão simples assim. Decretar a morte de um browser obsoleto é apenas o ínicio do trabalho.

Rockmelt.

E como já não bastasse todo este barulho no mercado de browsers, vem aí mais um nome de peso. E que nome. Trata-se de Marc Andreessen, criador da Netscape. O mesmo que protagonizou a briga com a Microsoft.

Ao que tudo indica, ele está de volta com o Rockmelt, um novo browser que, segundo palavras do próprio Andreesen, está sendo criado do zero. Para uma nova web que passou de páginas estáticas para complexos sites, serviços e aplicativos.

É esperar pra ver!

Já que chegou até aqui, que tal ler isto?

• Comunicavale – Comunicação corporativa no Vale do Paraíba

CSS

Seletores de atributos e operadores

Os seletores de atributos são escritos entre colchetes “[]“.
Exemplo: a[href='manual.pdf']

Este exemplo é interessante mas não tão útil, pois neste caso o estilo só será aplicado ao link com o atributo href=’manual.pdf’.

Para tornar o uso mais interessante vamos utilizar $ que é um operador que significa “termina com”.
Desta forma podemos criar um seletor para estilizar todos os links para arquivos PDF.
Exemplo: a[href$='.pdf']

Você também pode utilizar o operador ^, que significa “começa com” e o operador * que busca a ocorrência do valor em qualquer parte do atributo.
Complicou? Veja os exemplos:

Busca todos os links que iniciam com ‘http:’
a[href^='http:']
Busca todos os links que iniciam com ‘mailto:’
a[href^='mailto:']

Busca todos os links que contenham a palavra ‘css’
a[href*='css']

Para finalizar veja este exemplo de estilização de links para documentos PDF, MDB e XLS

a[href$='.pdf'] {
display:inline-block;
padding-left:20px;
line-height:18px;
background:transparent url(doc_pdf.png) center left no-repeat;
}
a[href$='.mdb'] {
display:inline-block;
padding-left:20px;
line-height:18px;
background:transparent url(doc_access.png) center left no-repeat;
}
a[href$='.xls'] {
display:inline-block;
padding-left:20px;
line-height:18px;
background:transparent url(doc_excel_table.png) center left no-repeat;
}

Clique aqui para ver o exemplo em funcionamento

Vale lembrar que estes seletores fazem parte do CSS 3. Embora o CSS 3 ainda não esteja totalmente incorporado aos navegadores
os exemplos colocados aqui funcionaram nos browsers mais recentes (IE7, IE8, Firefox3, Chrome e Safari 4).
Em browsers antigos, como o IE6 por exemplo, o ícone simplesmente não aparece o que não causa um prejuízo muito grande a navegação.

Artigo baseado no original http://rafeekphp.wordpress.com/2009/06/11/auto-matic-link-icons/

Referência de seletores CSS 2.1
http://maujor.com/tutorial/seletores_css21_parte1.php

Referência de seletores CSS 3
http://www.w3.org/TR/css3-selectors/

Já que chegou até aqui, que tal ler isto?

• Método data() da jQuery
• Função live() da jQuery
• Função closest() da jQuery

Já tentou inserir arquivos de imagens .png com transparência em seu projeto e visualizá-lo no IE6? Pois é.

Existem muitas formas de se corrigir o problema. Vou apresentar a que mais uso, que é através do plugin do jQuery chamando pngFix .

Veja os exemplos (em inglês), e faça o download do plugin no site – http://jquery.andreaseberhard.de/pngFix/

Para usá-lo é super simples:

Insira os arquivos javascript do jQuery e o arquivo do plugin. Certifique-se que os nomes dos arquivos estão iguais aos que você salvou em seu computador/servidor.

1
2

<script src="jquery-latest.pack.js" type="text/javascript"></script>
<script src="jquery.pngFix.js" type="text/javascript"></script>

Agora o código que faz todo o serviço:

1
2
3
4
5

<script type="text/javascript"> 
    $(document).ready(function(){ 
        $(document).pngFix(); 
    }); 
</script>

Pronto! Só isso. Qualquer dúvida só deixar um comentário.

Já que chegou até aqui, que tal ler isto?

• 10 dicas para escrever um bom código jQuery
• Saiba se uma requisição foi feita via AJAX no PHP
• Método data() da jQuery
• Função live() da jQuery
• Função closest() da jQuery

Quem quiser saber mais, visite o sobre, entre em contato ou mande um email para jc_bitencourt [arroba] hotmail.com contato [arroba] juliobitencourt.com.

Postei alguns artigos no blog da Contagia, mas resolvemos deixar o blog da agência para assuntos menos técnicos e mais de mercado, portifólio, etc.

Grande abraço!

Já que chegou até aqui, que tal ler isto?

• Este post não tem posts relacionados