I am using the following code to adjust the size of all P tags. This tag is design to work with three buttons a increase font button a decrease font button and a reset button
I would like to modify this so it works with just one button.... I would like the first 4 clicks to run the increase font size function then the 5th click to reset the font. Can somebody suggest how to do this? // font resizer $(document).ready(function() { // Reset Font Size var originalFontSize = $('p').css('font-size'); $("#resetFont").click(function(){ $('p').css('font-size', originalFontSize); }); // Increase Font Size $("#fontSize").click(function(){ var currentFontSize = $('p').css('font-size'); var currentFontSizeNum = parseFloat(currentFontSize, 10); var newFontSize = currentFontSizeNum*1.2; if ( newFontSize < 30 ) { $("p").css({fontSize : newFontSize}); } return false; }); // Decrease Font Size $("#decreaseFont").click(function(){ var currentFontSize = $('p').css('font-size'); var currentFontSizeNum = parseFloat(currentFontSize, 10); var newFontSize = currentFontSizeNum*0.8; if ( newFontSize > 12 ) { $("p").css({fontSize : newFontSize}); } return false; }); });