Seguramente este truco ya lo haz visto, no sólo en algunos blogs, sino también en algunos periódicos virtuales.
Se trata de dos enlaces (en este caso botones) que hacen que las letras del blog completo se achiquen o agranden, según los que indique el botón, para gente con alguna discapacidad visual. Además incluye un botón que hace que las letras vuelvan al tamaño original.
Poner botones para agrandar o achicar letra en el blog Hay un detalle que no mencioné, y es que este truco posee efectos de jquery.
Para instalar el Script del truco debemos ir a Blogger → Diseño → Edición de HTML → Buscamos la etiqueta </head> presionando ctrl+f → Cuando hayamos encontrado la etiqueta </head>, pegamos el siguiente código arriba de la etiqueta:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<!-- más trucos jquery en teoriablogger.blogspot.com -->
<script type='text/javascript'>
$(function(){$('input').click(function(){
var ourText = $('#content-wrapper');
var currFontSize = ourText.css('fontSize');
var finalNum = parseFloat(currFontSize, 10);
var stringEnding = currFontSize.slice(-2);
if(this.id == 'a') {finalNum *= 1.1;}
else if (this.id == 'achicar'){finalNum /=1.1;}
else if (this.id == 'reiniciar'){finalNum =13;}
ourText.animate({fontSize: finalNum + stringEnding},500);});});
</script>Si ya haz utilizado un código Jquery antes, no agregues el código que está escrito en rojo .
El próximo paso es agregar los botones al blog, a los botones los vamos a alojar en un gadget. Vamos a Blogger → Diseño → Elementos de la página → Elegimos la opción HTML/Javascript y pegamos los códgios siguientes:
<div id='resizefont'>
<input id="agrandar" title="teoriablogger.blogspot.com" type="button" value="A+" />
<input id="reiniciar" title="teoriablogger.blogspot.com" type="button" value="A" />
<input id="achicar" title="teoriablogger.blogspot.com" type="button" value="A-" />
</div> Debes saber que estos botones sólo achican o agrandan palabras o letras, no imágenes o objetos de video o algo por el estilo.
0 comentarios:
Publicar un comentario
Podés utilizar códigos HTML como <a><b><i>.
Si tenés alguna duda, no dudes en recurrir a nuestro Formulario de contacto.