Ferramenta para aumentar e diminuir o tamanho do texto no blog
Muita gente procura como colocar a ferramenta de zoom (aumentar e diminuir o texto) no blog, então encontramos esse código que funcionou perfeitamente no Internet Explorer e Firefox. O jeito de colocar essa ferramenta no seu blog é muito simples, basta entrar na pagina layout, adicionar gadget, html/javascript e colar o código abaixo:
<script><!--
var fs=new Array('12px','18px','22px','25px');var contador=0;function novoTamanho(x){if(x==0){if(contador<fs.length-1){contador++;document.getElementById("outer-wrapper").style.fontSize=fs[contador];document.getElementById("outer-wrapper").style.lineHeight=fs[contador];}}
if(x==1){if(contador>0){contador--;document.getElementById("outer-wrapper").style.fontSize=fs[contador];document.getElementById("outer-wrapper").style.lineHeight=fs[contador];}}}//-->
</script>
<a href="javascript:novoTamanho(0)" class="aumef bra" title="Aumenta a fonte Ctrl +">Mais Zoom</a><a href="javascript:novoTamanho(1)" class="aumef bra" title="Diminui a fonte Ctrl -">Menos Zoom</a>
Depois que colocar e testar o código no seu blog você pode personalizar como quiser o link para aumentar ou diminuir o texto escrevendo o que desejar onde está Mais Zoom e Menos Zoom, se preferir pode trocar por imagens usando o seguinte código no lugar de cada um desses textos:
<img src="endereço da imagem" border="0" />
Apenas tome cuidado para hospedar e usar o endereço correto da imagem no código. Outra coisa fácil de mudar é o texto que aparece quando colocamos o mouse sobre o link, veja no código onde está escrito: Diminui a fonte Ctrl- e Aumenta a fonte Ctrl +, depois caso quiser pode alterar para qualquer outro texto, mas lembre-se isso só aparece quando colocar o mouse sobre o link ou imagem que reduz ou amplia o texto do seu blog.
Outra coisa que podemos escolher no código são as opções de tamanho de fonte que usaremos, veja na primeira linha '12px','18px','22px','25px', você pode mudar para outros valores se quiser, apenas cuidado para não apagar os símbolos ao lado dos numeros. Mas você não deve colocar mais opções, ou seja apenas troque os valores que desejar.
<script><!--
var fs=new Array('12px','18px','22px','25px');var contador=0;function novoTamanho(x){if(x==0){if(contador<fs.length-1){contador++;document.getElementById("outer-wrapper").style.fontSize=fs[contador];document.getElementById("outer-wrapper").style.lineHeight=fs[contador];}}
if(x==1){if(contador>0){contador--;document.getElementById("outer-wrapper").style.fontSize=fs[contador];document.getElementById("outer-wrapper").style.lineHeight=fs[contador];}}}//-->
</script>
<a href="javascript:novoTamanho(0)" class="aumef bra" title="Aumenta a fonte Ctrl +">Mais Zoom</a><a href="javascript:novoTamanho(1)" class="aumef bra" title="Diminui a fonte Ctrl -">Menos Zoom</a>
<img src="endereço da imagem" border="0" />
Apenas tome cuidado para hospedar e usar o endereço correto da imagem no código. Outra coisa fácil de mudar é o texto que aparece quando colocamos o mouse sobre o link, veja no código onde está escrito: Diminui a fonte Ctrl- e Aumenta a fonte Ctrl +, depois caso quiser pode alterar para qualquer outro texto, mas lembre-se isso só aparece quando colocar o mouse sobre o link ou imagem que reduz ou amplia o texto do seu blog.
Outra coisa que podemos escolher no código são as opções de tamanho de fonte que usaremos, veja na primeira linha '12px','18px','22px','25px', você pode mudar para outros valores se quiser, apenas cuidado para não apagar os símbolos ao lado dos numeros. Mas você não deve colocar mais opções, ou seja apenas troque os valores que desejar.
Marcadores: Acessórios, Códigos, Ferramentas, Scripts