Eu estava tendo problemas em vários projetos em que o aliasing de texto quando uma transição ocorreria faria com que o aliasing do texto passasse de subpixel para antialias por uma fração de segundo e depois retornasse ao subpixel.
O problema aconteceria com o texto nem mesmo conectado aos elementos afetados. Foi horrível, mas depois de alguns problemas, encontrei algumas soluções.
Existem duas soluções para isso:
1. Defina seu texto problemático para ser suavizado:
-webkit-font-smoothing: antialiased;Você verá aqui http://maxvoltar.com/sandbox/fontsmoothing/
um exemplo de como os diferentes tipos de alias afetam seu texto.
O que você deveria saber
Obviamente, isso só funciona para -webkit-. Além disso, seu tipo será muito mais fino e você desejará aumentar um pouco o peso da fonte. Mas então em -moz- sua espessura de fonte será mais espessa do que o desejado.
2. Defina o z-index do elemento afetado acima de todo o texto.
Por alguma razão, o Z-index entra em jogo com esse problema. Parece que se o elemento afetado está abaixo do texto por meio do índice z, isso faz com que o texto reavalie seu alias.
.troubled-text p {
position: relative;
z-index: 100
}
.effected-element {
position: relative;
z-index: 200
}Portanto, se o ajuste do Z-index não destruir o design do seu site, aumente o Z-index. e wallah.
Meus pensamentos
Eu sempre sugeriria a opção 2, pois não gosto de hackear código para vários navegadores. Embora em alguns lugares a Opção 1 possa ser sua única opção.
Qualquer dúvida, basta perguntar.