dcsimg
www.webdeveloper.com
Results 1 to 2 of 2

Thread: Please i need some help on this one it is almost finished

  1. #1
    Join Date
    Nov 2012
    Posts
    1

    Post Please i need some help on this one it is almost finished

    my code should on button click (+) increase the font size of the first "How r u" and when pressing (-)decrease the font size of the second how r u

    <html>
    <head>
    <title>Increase and Decrease font size using buttons</title>
    <meta charset="utf-8">

    <script type="text/javascript">

    document.writeln("<p id='line1'>How r u</p>");
    <input id="increase" type="button"onclick="increaseFontSize()" value="+" />
    document.writeln("<p id='line2'>How r u</p>");
    <input id="decrease" type="button"onclick="decreaseFontSize()" value="-" />
    var min=8;
    var max=18;
    function increaseFontSize() {
    var p = document.getElementById('line1');
    for(i=0;i<p.length;i++) {
    if(p[i].style.fontSize) {
    var s = parseInt(p[i].style.fontSize.replace("px",""));
    } else {
    var s = 12;
    }
    if(s!=max) {
    s += 1;
    }
    p[i].style.fontSize = s+"px"
    }
    }
    function decreaseFontSize() {
    var p = document.getElementById('line2');
    for(i=0;i<p.length;i++) {
    if(p[i].style.fontSize) {
    var s = parseInt(p[i].style.fontSize.replace("px",""));
    } else {
    var s = 12;
    }
    if(s!=min) {
    s -= 1;
    }
    p[i].style.fontSize = s+"px"
    }
    }


    </script>
    </head>


    <body>
    </body>
    </html>

  2. #2
    Join Date
    Mar 2007
    Location
    U.K.
    Posts
    1,127
    If you're going to write into the body, the script should be inside the body.

    You have HTML tags in your script block.

    A P element does not have a length property.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles