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;
});
});
No comments:
Post a Comment