domingo, 23 de agosto de 2009

Botón para agrandar o achicar el tamaño de letra del blog

Hay quienes sufren de problemas a la vista; quizás no puedan leer letras muy pequeñas o al mirar letras pequeñas se les canse la vista rápidamente. ¿Cómo podemos ayudar a estos lectores? Pues aplicando un botón para que ellos puedan graduar el tamaño de letra que les sea más fácil de leer.

El conseguirlo es muy sencillo.

♠ Primero vamos a Diseño - Edición de HTML y con ayuda de CTRL+F buscamos </body>.
♠ Antes de </body> pegaremos el siguiente script:

<script type='text/javascript'>
//<![CDATA[
var tgs = new Array( 'div','td','tr');
var szs = new Array( 'xx-small','x-small','small','medium','large','x-large','xx-large' );
var startSz = 2;
function ts( trgt,inc ) {
if (!document.getElementById) return
var d = document,cEl = null,sz = startSz,i,j,cTags;
sz += inc;
if ( sz < 0 ) sz = 0;
if ( sz > 6 ) sz = 6;
startSz = sz;
if (!( cEl = d.getElementById( trgt ) ) ) cEl = d.getElementsByTagName( trgt )[ 0 ];
cEl.style.fontSize = szs[ sz ];
for ( i = 0 ; i < tgs.length ; i++ ) {
cTags = cEl.getElementsByTagName( tgs[ i ] );
for ( j = 0 ; j < cTags.length ; j++ ) cTags[ j ].style.fontSize = szs[ sz ];
}}
//]]>
</script>

♠ Damos click a guardar.
♠ Ahora, vamos a Diseño - Elementos de la página - Añadir un gadget y escogemos HTML/Javascript.
♠ En el nuevo elemento pegaremos el siguiente código:

<a href="javascript:ts('body',2)">T+</a> <a href="javascript:ts('body',-1)">t-</a>

♠ Si deseamos podemos reemplazar T+ y t- por algún botón. Damos click a guardar y listo.

Pueden ver una DEMO en mi blog de pruebas.


Fuente: Karakas-Online

No hay comentarios:

Publicar un comentario