Question

I have such code:

    <script type="text/javascript">
    function changeFontSize(element,step)
    { 
     step = parseInt(step,10);
     var el = document.getElementById(element);
     var curFont = parseInt(el.style.fontSize,10);
     el.style.fontSize = (curFont+step) + 'px';
    }
    </script>

and such HTML code:

    <section id="contentb" style="font-size:16px;">...</section>
    <a href="javascript:void(0);" onclick="changeFontSize('contentb',2);">change +</a>
    <a href="javascript:void(0);" onclick="changeFontSize('contentb',-2);">change -</a>

How do I write code that I can plus text only to 24px(4 times) and minus only to 8px(4 times)?

Answer 1

I’m not sure I understood the question, but if you wan’t to limit the fontsize to 24px then this will work:

<script type="text/javascript">
function changeFontSize(element,step)
{ 
 step = parseInt(step,10);
 var el = document.getElementById(element);
 var curFont = parseInt(el.style.fontSize,10);
 if(curFont < 24) {
    el.style.fontSize = (curFont+step) + 'px';
 }
}
</script>

<section id="contentb" style="font-size:8px;">...</section>
<a href="javascript:void(0);" onclick="changeFontSize('contentb',4);">change</a>