Refresh de CSS para o Mozilla Firefox
Por:
Terça-feira 01 Agosto 2006 às 07:40Categoria: HTML / CSS / JavaScript
Quando estou desenvolvendo um site novo, uma das coisas que mais acho chato é ter que dar refresh na página inteira para poder ver apenas atualizações que foram feitas na minha folha de estilos externa. Tempos atrás navegando pela Web, encontrei um script muito muito interessante que faz o que eu sempre quis fazer: ele força o re-download somente do CSS.
Isso funciona da seguinte maneira: seja em um servidor interno ou externo, quando você faz atualizações somente no CSS e aperta F5 em qualquer browser, você acaba baixando todo o XHTML e as imagens novamente. Quando está trabalhando em um servidor remoto, isso é ainda mais chato e acaba tomando alguns segundos precisosos do seu tempo. Com o JavaScript demonstrado abaixo, você cria um botão na sua bookmarks toolbar do Mozilla Firefox (sim, somente no Firefox, o Internet Explorer não possuiu este recurso), e toda vez que quiser dar um refresh somente nas folhas de estilos do site que você está desenvolvendo, basta clicar no botão, que ele deleta os arquivos de CSS do cache da sua máquina e faz o download novamente. E bem rapidinho.
Para criar este botão, faça o seguinte. Clique com o botão direito sobre a sua “bookmark toolbar” no Firefox. No menu contextual que abrir selecione “New Bookmark“. No campo “name” digite algo do tipo “CSS Refresh” e no campo “location“, cole o seguinte script:
javascript:void(function(){var i,a,s;a=document.getElementsByTagName('link');for(i=0;i<a.length;i++){s=a[i];if(s.rel.toLowerCase().indexOf('stylesheet')>=0&&s.href) {var h=s.href.replace(/(&|%5C?)forceReload=\d+/,'');s.href=h+(h.indexOf('?')>=0?'&':'?')+'forceReload='+(new Date().valueOf())}}})();Agora, sempre que estiver no Firefox fazendo alterações de CSS, basta clicar neste botão pra atualizar somente sua folha de estilos. Infelizmente, eu perdi o artigo onde originalmente eu encontrei este código. Se alguém souber, por favor me informe para que eu possa dar os devidos créditos ao autor do script.
Artigos relacionados:
- Scrollbar no Firefox
- Declaração de codificação de caracteres em CSS
- Alguém se importa em validar a folha de estilos?
- CRIR – Checkbox & Radio Input Replacement
- O caminho torto ou o torto caminho dos padrões?
- Conditional Comments no Internet Explorer
- Animated Scroll em JavaScript
Este texto não pode ser copiado ou reproduzido em nenhum outro site na íntegra sem autorização do autor!. Mais detalhes sobre licença de uso aqui!
O Revolução Etc é o site pessoal do Henrique C. Pereira que trabalha com design de interfaces, planejamento, arquitetura da informação e desenvolvimento para web. Ele escreve aqui sobre várias coisas relacionadas com acessibilidade, web standards, tecnologia, desenvolvimento e o que mais der na telha, além de eventualmente escrever alguma coisa ou outra para o Webinsider. Leia mais.
# 1° Tiago Bega Terça-feira 01 Agosto 2006 às 07:54GMT
Maravilha, fiz aqui e funcionou perfeitamente ontem mesmo estava imaginando alguma maneira de fazer isto.
Muito bao a indicação