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

5 opinaron:

squirrel

Muy interesante script; me encantó

Besos :)

Responder
G

Es un srcipt muy bueno y útil; ayudará a no malograrnos la vista y poder leer mejor :)

Responder
Gus

que tal, sabes que quise poner ambas "T" con su signo un poco mas grandes y no me sale bien. Me decis como? Gracias. Muy bueno el blog, te sigo.Saludos

Responder
Jéssica YK

» squirrel: sí, es muy útil.

» G: tienes razón :)

» Gus: para hacer que las letras "T" tengan un tamaño más grande, házlo del siguiente modo:

<a href="javascript:ts('body',2)"><span style="font-size:130%;">T+</span></a> <a href="javascript:ts('body',-1)"><span style="font-size:130%;">t-</span></a>

S@lu2

Responder
Nedda

Mi url: http://elarmariodenedda.blogspot.com
Gracias!

Responder

Por favor, trata de tener habilitado tu perfil (has click en "Comenta con el antiguo editor" para iniciar sesión) o deja un enlace a tu blog escogiendo la opción "Nombre/URL", procura no dejar comentarios Anónimos.
Nota: Si es que se presenta algún problema con el formulario de comentarios, sólo has click en "Comenta con el antiguo editor"

Gracias por participar en el blog.

inicio