Mistérios móveis

AVISO: Trabalho em andamento.

Esta postagem pretende resumir alguns dos bugs ou peculiaridades específicos para dispositivos móveis que encontrei enquanto trabalhava como consultor em projetos na Noruega. Será um documento ativo, o que significa que adicionarei coisas à medida que surgirem.

Seletor de irmão no Android 2.3.3 / HTC Desire

O seletor geral de irmãos (~) simplesmente não funciona em Androids antigos. Aprendi esse último dia do lançamento e tive que reescrever todas as coisas. Bem, uma coisa.

Nomes de palavras-chave reservados

Obviamente, as variáveis ​​não podem ter nomes que sejam palavras-chave reservadas em javascript. Por exemplo, você não pode ter nada disso:

var if = "foo";
var delete = "bar";
var var = "baz";

No entanto, as propriedades do objeto podem:

var obj = {
delete: 1,
if: 'two',
while: 'true'
};

Lembre-se de que isso não significa que você deva prosseguir e fazer isso, embora seja sintaticamente legal. O tio bêbado chegando atrasado e estragando a festa, neste caso, é o Tio Legado. O Internet Explorer 7 e 8 e o Windows Phone 7 interromperão a execução do javascript assim que você tentar acessar uma dessas propriedades.

Se você estiver absolutamente determinado a isso, pode ser útil acessar as propriedades usando a sintaxe de colchetes em vez da sintaxe de pontos. Não vai garantir a sua segurança, portanto, use por sua própria conta e risco.

var obj['delete']; // may work
var obj.delete; // bad

Unidades de propriedade CSS no Mobile Safari

Ao usar a propriedade position do CSS juntamente com qualquer um dos {top | certo | inferior | esquerda}, algumas pessoas tendem a omitir as unidades e apenas colocar 0 como o valor, assim:

position: absolute;
top
: 0;
bottom
: 0;
right
: 0;
left
: 0;

A maioria dos navegadores modernos lida com isso muito bem, no entanto, o Safari móvel no iOS não. Certifique-se de especificar uma unidade:

top: 0px;