Archive for 'IE'
w3FormValidation 2.3
February 2nd, 2007. Published under IE, add-on, freeDOM.js, labs, w3formvalidation. 2 Comments.
Disponível a versão 2.3 do w3FormValidation. Essa versão inclui a correção de um bug em que as tags select são exibidas sobre o overlay no body no Microsoft Internet Explorer.
“Novas” regras CSS para o Internet Explorer 7 - Child Selector
January 1st, 2007. Published under IE, css, w3c. 2 Comments.
Com o lançamento do Internet Explorer 7, temos a nova disposição “novas” regras CSS que utilizaremos sem a preocupação, se o IE irá interpretá-las ou não. Essas “novas” regras possibilitarão ao desenvolvedor/designer um controle maior sobre os elementos HTML.
Com esse feito - um controle maior sobre os elementos HTML - evitamos a classite (falarei sobre ela em um outro post), ou seja, o uso excessivo de classes desnecessárias; bem como os ids. Então, vamos conhecer as “novas” regras CSS para o Internet Explorer 7:
Child Selector
O que é um child Selector?
É um tipo de regra CSS destinado aos filhos de um determinado elemento. Isto é, a regra CSS será aplicada somente aos filhos de um elemento HTML e não em seu neto, por exemplo.
Um exemplo de child Selector
Para clarear melhor a explicação sobre o que é um child selector, imagine o seguinte cenário:
<body>
<div>div filha 1 <div>div neta 1</div></div>
<div>div filha 2 </div>
</body>
E esta regra CSS:
body div {
padding: 20px;
}
Ou seja, todas as tags div do documento terão um padding de 20px. Não importando se ela é filha, neta ou bisneta da tag body. Agora, se utilizarmos a seguinte regra CSS:
body>div{
padding: 20px;
}
Somente as tags div filhas que receberão tal regra.
Com esse recurso não há aquela necessidade de adicionar à determinada tag uma classe ou um id; e com isso atribuir a regra CSS à classe ou id determinado.
Os child selectors foi (e ainda é em alguns sites) muito utilizado como um hack para esconder regras CSS do IE. Mas, no Internet Explorer 7 isto não acontecerá mais, uma vez que ele finalmente interpretará os child selector.
Se houver necessidade de esconder uma determinada regra CSS do IE 7; podemos utilizar um comentário vazio após o sinal de maior que da seguinte maneira:
body>/***/body .alguma_classe {
...
}
A regra CSS acima será ignorada pelo Internet Explorer 7 e sinceramente não sei o motivo. Alguém sabe? Comente aí 
Diferenças entre os browsers ao interpretar JavaScript #1
December 21st, 2006. Published under IE, crossbrowser, firefox, javascript, opera. 2 Comments.
Estou lançando uma série que pretendo manter aqui no blog: Diferença entre browsers ao interpretar JavaScript. Ela terá a simples intenção de arquivar algumas diferença que percebo duramente o meu dia-a-dia de desenvolvimento utilizando tal linguagem. Mas, como não quero manter isso só pra mim, decidir compartilhar e disponibilizar por aqui
Vamos ao primeiro exemplo de hoje, o qual me motivou a iniciar esta série. Observe o seguinte código:
// Seleciona todos os links contidos na página
var arrLinks = $tags('a');
// Loop entre os links selecionados
for ( var i = 0, objLink; objLink = arrLinks[i]; i++) {
// Selecionamos o atributo rel do link em questão
var objLinkAttRel = objLink.getAttribute(’rel’);
// Descobrimos o tipo da varíavel que armazenou o atributo rel do link
alert(’Tipo: ‘ + typeof(objLinkAttRel));
}
Bom, o código está auto-explicativo (se não o compreendeu, comente). Observe o resultado obtido:
- Tipo: string = Internet Explorer 6
- Tipo: object = Firefox 2.0.0.1
- Tipo: object = Opera 9
Como você percebeu, somente o Internet Explorer interpreta o tipo da variável como Object String. Então, se você faz um código assim:
...
var objLinkAttRel = objLink.getAttribute('rel');
if ( objLinkAttRel.substring(0,3) == 'foo' ) {
// Faz alguma coisa
}
Com o intuito de verificar o conteúdo do atributo rel dos links selecionados, e testa somente no Internet Explorer, você verá seu script funcionando perfeitamente. Mas ao testar em outros navegadores - como o Firefox e o Opera - você terá uma mensagem de erro - objLinkAttRel has no properties. Isto por que você está utilizando um método - substring - para trabalhar com Objects Strings. E como eles não interpretam tal variável como Object String, certamente não funcionará.
Então, o que fazer para que tenhamos esse código de forma crossbrowser? Simples, ao selecionar o conteúdo do atributo rel dos links, iremos transformá-lo em um Object String. Para que todos os browsers o interpretam dessa maneira (como Object String). Observe:
// Seleciona todos os links contidos na página
var arrLinks = $tags('a');
// Loop entre os links selecionados
for ( var i = 0, objLink; objLink = arrLinks[i]; i++) {
// Selecionamos o atributo rel do link em questão
var objLinkAttRel = new String(objLink.getAttribute(’rel’)); // Observe: new String()
if ( objLinkAttRel.substring(0,3) == ‘foo’ ) {
// Faz alguma coisa
}
}
}
Somente. Gosto sempre de trabalhar com vários navegadores abertos e testando tudo ao mesmo tempo, assim já identifico de imediato algumas divergências entre os navegadores e procuro uma alternativa para deixar meus códigos sempre de forma crossbrowser
Microsoft se prepara para 2007 com redesign drástico em sua Home Page
December 20th, 2006. Published under IE, acessibilidade, ajax, javascript, microsoft, opinião, web standards. 3 Comments.
A Microsoft Corporation lançou sua nova home page e sinceramente, me surpreendi com o redesign. Primeiro, por se tratar de uma empresa que mantém o browser do ícone azul. Segundo por ela não aderir como deveria os padrões da web (será?).
Com o lançamento do Internet Explorer 7, e a preparação para o Windows Vista e o Office 2007 para o próximo ano, a empresa de Bill Gates estrutura sua nova home page com base nos padrões da web e na utilização do Ajax. Acredite: eles usaram javascript não-obstrutivo.
A dois anos atrás, um grande nome ligado aos padrões da web, refez a home page da companhia com técnicas de CSS para Layout. Confira. Mas agora em 2006, caminhando para 2007 a sugestão parece ter surgido efeito (como demorou hein).
A nova interface como demonstrada abaixo:
Utiliza o Ajax para carregar o conteúdo dinâmicamente através dos links dispostos no menu flutuante à direita. Caso o usuário esteja com o JavaScript desabilitado ou não tenha suporte a esse recurso, ele navegará perfeitamente pelo site, uma vez que os desenvolvedores utilizaram o JavaScript como deve ser: não-obstrutivo.
Uma vez clicado nos links do menu, o conteúdo é exibido em um painel que oferece três opções de visualização de conteúdo (Detail, Thumbnail, Text). Observe a imagem abaixo:
O painel exibido ao clicar nos links do menu flutuante à direita, também oferece uma navegação em um menu flutuante à esquerda, que também utilizada o Ajax para carregar o conteúdo e exibi-lo nesse mesmo painel.
A navegação secundária, localizada na parte inferior da página, altera seu conteúdo dinâmicamente através do evento onmouseover. Os desenvolvedores também privilegiaram a navegação através do teclado, testei aqui e funcionou perfeitamente.
Meu primeiro contato com esta nova Home Page da Microsoft foi super positiva. Fiquei feliz de ver essa empresa se preocupar com a acessibilidade e com os padrões da web. E você, o que achou deste redesign?
Para os amantes do Firefox, uma boa notícia.
December 4th, 2006. Published under IE, firefox, rapidinhas. No Comments.
O Firefox subiu 0,46 ponto percentual e chegou a 13,5% de participação de mercado em novembro. Enquanto nosso “amigo” Internet Explorer recuou de 81,28% para 80,56%. Isto é, segundo uma pesquisa da NetApplications.
Veja mais detalhes em Participação do browser Firefox aumenta para 13,5% em novembro
JSLint - Verificador de códigos JavaScript
November 22nd, 2006. Published under IE, firefox, javascript. 1 Comment.
Conheci recentemente o JSLint, um verificador de códigos JavaScript. Sua utilização é bem simples. Você cola seu código JavaScript no verificador e pede a ele para verificar o código colado, somente.
Nem sempre nosso amigo Firefox ou nosso outro “amigo” Internet Explorer fazem uma verificação 100% dos nossos códigos JavaScript, então, é bom verificar o código para evitar problemas em navegadores, nos seus sistemas, com seus clientes, e claro, evitar dor de cabeça.
Por isso, meu caro, estou sugerindo a você a visitar o JSLint e conhecê-lo. O autor da aplicação Douglas Crockfords disponibilizou também uma convenção de códigos em JavaScript.