2008 20 de junho de 2008

Bug espaço em branco em Linha / Lista de Itens (LI) no IE6

Se você já fez (ou fazer um) um menu vertical usando itens da lista (li) tags e CSS, você pode encontrar, este ainda um outro bug no Internet Explorer, onde o IE 6 insere estas lacunas entre os itens de lista que contêm elementos nível de bloco, ou seja, se há qualquer espaço em branco entre os itens da lista na marcação. Obrigado, mas não, obrigado, a versão do IE 7 parece livre desse bug.
Se gosta de mim, e muitos mais, você pertence a esse grupo de desenvolvedores frustrados, que ainda têm para obter os seus novos layouts, trabalhando no IE6 também, então isso pode ser útil. Dê uma olhada ...

Marcação de exemplo:

<ul id="menu">
<li> <a href="#"> Home </ a> </ li>
<li> <a href="#"> Sobre </ a> </ li>
<li> <a href="#"> Serviços </ a> </ li>
<li> <a href="#"> Portfolio </ a> </ li>
<li> <a href="#"> FAQ </ a> </ li>
<li> <a href="#"> Fale Conosco </ a> </ li>
</ Ul>

Você pode criar um pouco de CSS, semelhante a um abaixo, para transfrom a marcação acima em um menu vertical ....

Exemplo de CSS ...
# Menu {
margin: 0; padding: 0; background: # FF9900;
list-style-type: none; width: 150px;
}
# Menu li {margin: 0; padding: 0;}
# Menu a {display: block;
color: # 555555;
text-decoration: none;
padding: 0 15px;
line-height: 2.5; border-bottom: 1px solid # FFF;
}

Os resultados que você verá ...
nulo

A solução para este bug ... (modificado / adicionado CSS em negrito e itálico)

# Menu {
margin: 0; padding: 0; background: # FF9900; list-style-type: none; width: 150px;
float: left; / * este contém itens de lista flutuou * /
}
# Menu li {
margin: 0; padding: 0;
float: left; / * Isso corrige o * /
width: 100%; / bug * espaço em branco no IE6 * /
}
# Menu a {
bloco; cor:: display # 555555;
text-decoration: none;
padding: 0 15px;
line-height: 2.5; border-bottom: 1px solid # FFF;
}

Se a solução acima doesnot parecem funcionar (por razões conhecidas apenas para IE6) ... tentar este método em vez

Basta adicionar esta adicionais IE6 estilos únicos a sua marcação ...

<! - [If lt IE 7>
<style type="text/css">
# Menu li a {display: inline-block;}
# Menu li a {display: block;}
</ Style>
<[Endif] ->


2008 06 de junho de 2008

Melhores práticas: manter o número de elementos DOM Pequeno

Mais os elementos DOM na página, mais lento torna, mais lento é o acesso DOM em JavaScript. Um número elevado de elementos DOM pode ser projeto de layout devido ruim. Por exemplo, as tabelas aninhadas poderiam ter sido utilizados para fins de distribuição. Utilizar qualquer tag HTML onde está faz sentido semanticamente. Para, por exemplo tabelas de uso DONOT para layouts, mas DONOT hesite em usá-los onde você tem que exibir dados tabulares, e, portanto, usará reduzir elementos DOM, em comparação, para uma estrutura semelhante criado usando DIVs apenas ..

Para testar o número de elementos DOM em sua página HTML, basta digitar o seguinte no console do Firebug: document.getElementsByTagName('*').length

Não há um padrão definido quanto ao número de elementos DOM são muitos. Confira outras páginas semelhantes que têm markup.Eg bom. Página inicial do Yahoo! é uma página muito ocupado e ainda em 700 elementos (tags de HTML).


2008 2 de junho de 2008

Melhores Práticas: Usando AJAX

Use GET para solicitações AJAX

Verificou-se que quando se utiliza XMLHttpRequest, o POST é implementado nos navegadores como um processo em duas etapas: enviar os cabeçalhos primeiro, em seguida, o envio de dados. Então, é melhor usar GET, que leva apenas um pacote TCP para enviar (a menos que você tem um monte de cookies). O comprimento máximo de URL no IE é 2K, então se você enviar mais de 2K de dados pode não ser capaz de usar GET.
Um efeito colateral interessante é que o POST sem realmente qualquer postagem de dados se comporta como GET. GET é destinado a recuperação de informações, por isso faz sentido (semântica) para usar GET quando você está apenas solicitando dados, em oposição ao envio de dados a serem armazenados no servidor.

Evite chamadas síncronas AJAX

Ao fazer "Ajax" pedidos, você pode escolher async ou modo de sincronização. Async modo corre o pedido em segundo plano enquanto outras atividades navegador pode continuar a processar. Modo de sincronização vai aguardar o pedido para retornar antes de continuar.
Pedidos feitos com o modo de sincronização devem ser evitados. Estes pedidos fará com que o navegador para bloquear para o usuário até que a solicitação retorna. Nos casos em que o servidor está ocupado ea resposta demora um pouco, o navegador do usuário (e talvez OS) não permitirá que qualquer outra coisa para ser feito. Nos casos em que uma resposta nunca é recebida corretamente, o navegador pode continuar a bloquear até que o pedido está esgotado.
Se você acha que sua situação requer modo de sincronização, é tempo mais provável para repensar seu projeto. Situações muito poucos (se houver) realmente necessitam de requisições Ajax em modo de sincronização.


NDK casa | Expressando IT | Palate Expressando | Penmenship Expressando | Awe Expressando | expressar-me