DISMINUIR EL TAMAÑO DE LA FUENTE DE UN DIV CON JQUERY


/ Published in: jQuery
Save to your folder(s)

Disminuye el tamaño de la fuente de un div definido por medio de etiquetas.


Copy this code and paste it in your HTML
  1. <head>
  2. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  3.  
  4. <title>CSSLab - jQuery plugin fontSizer</title>
  5. <script src="jquery-1.2.6.min.js" type="text/javascript"></script>
  6. <script src="jquery.fontSizer.js" type="text/javascript"></script>
  7. <script type="text/javascript">
  8.  
  9. //FUNCION QUE DISMINUYE LA FUENTE DEL DIV
  10. $(document).ready(function(){
  11. $('#aumentar').fontSizer({
  12. action: "up",
  13. elements: "#content",
  14. max: 36
  15. });
  16.  
  17. $('#disminuir').fontSizer({
  18. action: 'down',
  19. elements: "#content"
  20. });
  21. })
  22. </script>
  23.  
  24. <style type="text/css">
  25. body {font-family: Georgia, serif;}
  26. </style>
  27. </head>
  28.  
  29. <body>
  30.  
  31. <a href="#" id="aumentar" title="Aumenta tama&ntilde;o texto">Aumenta</a> - <a href="#" id="disminuir" title="Disminuye tama&ntilde;o texto">Disminuye</a>
  32.  
  33. <div id="content">
  34. <h1>CSSLab - jQuery plugin fontSizer</h1>
  35.  
  36. <ul>
  37. <li>Uno</li>
  38. <li>Dos</li>
  39. <li>Tres</li>
  40. </ul>
  41. <p>Vivamus auctor leo vel dui. <strong>Aliquam erat</strong> volutpat. Phasellus nibh. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Cras tempor. Morbi egestas, urna non consequat tempus, nunc arcu mollis enim, eu aliquam erat nulla non nibh. Duis consectetuer malesuada velit. Nam ante nulla, interdum vel, tristique ac, condimentum non, tellus. Proin ornare feugiat nisl. Suspendisse dolor nisl, ultrices at, eleifend vel, consequat at, dolor.</p>
  42.  
  43. </div>
  44.  
  45. </body>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.