Font Size Increase/Decrease


I have a website and I need put in a increase font section... i have the three graphics already inplace but I don't know how to make the buttons work....   Can anyone help with the code for this??

Here is the website address for the site i am using..

Thank you,
Who is Participating?
RobConnect With a Mentor Owner (Aidellio)Commented:
RobOwner (Aidellio)Commented:
With jQuery:

I've used * for all elements, however you may want to just to p elements or divs or spans etc
jQuery(function() {
jQuery('#id_of_increase_btn').on('click', function() {
// to increase
jQuery('*').css('font-size', function(i, size) { return parseFloat(size)*1.2; });

jQuery('#id_of_decrease_btn').on('click', function() {
// to decrease
jQuery('*').css('font-size', function(i, size) { return parseFloat(size)/1.2; });


Open in new window

cookmysterAuthor Commented:
Hey Rob,

when i put the javascript into a .js file and call it form the page I am working on... it doesn't seem to work.. but when i put al the javascript on the same page.. it works??  not sure what i am doing wrong

RobOwner (Aidellio)Commented:
Yeah it shouldn't matter so how are you including it and where in your page?
Is the code exactly the same whether in the page or in an external file?
Regardless the code has to be within a $(function() {...}) initialization or a function that is called after the page had loaded.
cookmysterAuthor Commented:
Awesome!!!  thank you very much
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.