• » Introdução PHP
  • » Box em Video
  • » Adicionando PHP á HTML
  • » Postagem com PHP
  • » Progamas Atualizados!
  • » Concurso de Layout!
  • Bom, nesta técnica usaremos um simples script em JS e uma div.

    Clique nos botões abaixo e veja como funciona

    Legal né? Então vamos colar nosso script acima da tag:
    </head>
    O script a ser colado é este:
    <script type='text/javascript'>
    //<![CDATA[
    function fontMais(){
    var obj = document.getElementById("textoFonte");
    if (obj.style.fontSize==""){obj.style.fontSize="12px"};
    if (obj.style.fontSize=="10px"){obj.style.fontSize = "12px";}
    else if (obj.style.fontSize=="12px"){obj.style.fontSize = "15px";}
    else if (obj.style.fontSize=="15px"){obj.style.fontSize = "17px";}
    else if (obj.style.fontSize=="17px"){obj.style.fontSize = "19px";}
    else if (obj.style.fontSize=="19px"){obj.style.fontSize = "21px";}
    }
    function fontMenos(){
    var obj = document.getElementById("textoFonte");
    if (obj.style.fontSize==""){obj.style.fontSize="12px"};
    if (obj.style.fontSize=="21px"){obj.style.fontSize = "19px";}
    else if (obj.style.fontSize=="19px"){obj.style.fontSize = "17px";}
    else if (obj.style.fontSize=="17px"){obj.style.fontSize = "15px";}
    else if (obj.style.fontSize=="15px"){obj.style.fontSize = "12px";}
    else if (obj.style.fontSize=="12px"){obj.style.fontSize = "10px";}
    }
    //]]>
    </script>


    Pronto, agora a Div para definir a área em que vai ser aplicado a mudança do tamanho da fonte fica assim:

    <div id='textoFonte'>TEXTO_AQUI</div>

    Agora se você quer fazer como eu fiz, para a alteração se aplicar a todo o conteúdo da postagem, basta vc ir em Design, Editar HTML, Expandir Modelos de Widgets.

    Procure pelo primeiro resultado de:
    <data:post.body/>

    Cole o seguinte código acima:
    <div id='textoFonte'>

    e acima do primeiro resultado de:
    <div class='post-footer'>

    Cole o fechamento da div:
    </div>

    Esta função não funciona direito porque ele sempre vai aumentar a fonte apenas do primeiro post exibido na página, por isso ela é recomendável apenas para você que usa a função Leia Mais

    Pronto, agr as alterações feitas a partir do botão serão aplicadas a todo o conteúdo do post.



    O código do botão Aumentar é:
    <a alt='Aumentar fonte' href='javascript:fontMais()'><img src='http://www.imgfans.com.br/NR/Fev12/12/mais.png'/></a>, E o Diminuir é:
    <a alt='Diminuir fonte' href='javascript:fontMenos()'><img src='http://www.imgfans.com.br/NR/Fev12/12/menos.png'/></a>

    Nenhum comentário:

    Postar um comentário