Função para aumentar ou diminuir o tamanho da fonte – Javascript

Como aumentar ou diminuir o tamanho da fonte utilizando apenas Javascript.

Como aumentar ou diminuir o tamanho da fonte

Primeira parte temos a função para aumentar o tamanho da fonte.

function aumentarLetra(){
var font = document.getElementById("Conteudo").style.fontSize;
font = font.replace("px","");
if(font == ""){		 
document.getElementById("Conteudo").style.fontSize = "13px";
}else{
document.getElementById("Conteudo").style.fontSize = (parseInt(font)+1)+"px";
}
}

Agora temos a função para diminuir o tamanho da fonte.

function diminuirLetra(){
var font = document.getElementById("Conteudo").style.fontSize;
font = font.replace("px","");
if(font == ""){		 
document.getElementById("Conteudo").style.fontSize = "11px";
}else{
document.getElementById("Conteudo").style.fontSize = (parseInt(font)-1)+"px";
}
}

Exemplo de utilização

Exemplo HTML utilizando as duas funções para manipular a div com o ID “Conteudo”.

<a onclick="aumentarLetra()">Aumentar</a> ou <a onclick="diminuirLetra()">Diminuir</a> o tamanho da fonte
<div id="Conteudo">Texto de teste...</div>

Não se esqueça de incluir às funções entre as tags <script></script> no seu arquivo HTML.

Um comentário sobre “Função para aumentar ou diminuir o tamanho da fonte – Javascript

Dúvidas? Faça um comentário logo abaixo ou envie uma mensagem clicando aqui.

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *