jQuery for Absolute Beginners: Day 9

In today’s video tutorial, I’ll show you how to resize text every time an associated anchor tag is clicked. We’ll be examining the “slice”, “parseFloat”, and “CSS” Javascript/jQuery methods.

Day 9: Resizing Text

Download the Source Code


  • Steve says:

    Thanks for doing these.

  • Reza says:

    Very helpfull.


  • Dave says:

    Just wanted to add that parseFloat does not take more than 1 parameter.

    So, parseFloat(x, 10) is the very same as parseFloat(x). The 10 will quite simply be ignored.

    (Don’t confuse this with parseInt, which takes 1-2 parameters, where the 2nd parameter defaults to 10)

    No need to mention that this screencast series is great :)

  • Tony Sirois says:

    This is great! I have shared these videos with everyone I know who is interested in jQuery. So glad this site exists. Thanks!.

  • Codie says:

    Loving it*********************

  • charlie says:

    Great! Amazing!
    My brain is getting bigger. Thanks for that.

  • Ahmed says:

    I love these videos. I have a question.

    What about if I want to show the size of the existing shown font (whenever I click on Smaller or Larger) so i can see what is the font size. How i can do that???

    Thanks… :)

  • ajl says:

    Great tuts! 10x

  • Sander says:

    tnx a lot, good starting point for beginners

  • Kapi says:

    Until a week ago I never knew much about jquery, thanks to you I am now working my way through your fantastic tutorials. Can’t thank you enough. Wish everyone taught as well as you do.

    Thanks very much!

  • Kenny says:

    Thank you very much for these great tutorials! I’m also new to jQuery and javascript.

    My question is, how to store the current font size to a cookies so that the next time the same person (same machine/account) revisit the website, that user will have the font-size that was choosen before?

    Right now, if the page is refresh or the user is going to a different page, or the user closed the broswer and re-open the page, that user have to change the font-size again.

    Thank you very much,

  • KN says:

    Firebug installed fine and worked for previous examples but for the code you used in this example the console was not defined and returned the following error:

    console is not defined
    [Break on this error] console.log(os);\r\n

    The code used was identical to your own however.

  • KN says:

    Regarding my comment about the console not being defined. I upgraded Firefox and the problem went away. I didn’t have to reinstall or update Firebug so it would appear the browser itself had a problem that is now resolved.

  • GrizzLyCRO says:

    I was confused about why in the end clicking on larger works. :D
    In click function, regardless of which anchor was clicked, size of paragraph will(should?) decrease and then IF anchor #larger was clicked it will increase.

    Then i read Mauro’s comment and i got it :)

    Thank you for these Tutorials, they are really awesome.
    I am now going to review my CSS knowledge, i had some positioning problems recently.

  • GrizzLyCRO says:

    Eh, and i forgot to tell you all one thing, video is broken only on some players, i downloaded everything from blip.tv with miro and got that purplish painting, tried playing .flv with VLC and it worked just fine.