I found out that the following code doesn't work in Internet Explorer:
function setFontSize() { // it doesn't work in IE $('<div id="font-sizer"><<div>'). html('<strong>Adjust font size:</strong> <a href="#" class="increaseFont">Increase</a> <span>|</span> <a href="#" class="decreaseFont">Decrease</a> <span>|</span> <a href="#" class="resetFont">Reset</a>'). appendTo('body'); var originalFontSize = $('body').css('font-size'); $(".resetFont").click(function(){ $('body').animate({fontSize: originalFontSize},600); return false; }); $(".increaseFont").click(function(){ var currentFontSize = $('body').css('font-size'); var currentFontSizeNum = parseFloat(currentFontSize, 10); var newFontSize = currentFontSizeNum * 1.2; $('body').animate({fontSize: newFontSize},600); return false; }); $(".decreaseFont").click(function(){ var currentFontSize = $('body').css('font-size'); var currentFontSizeNum = parseFloat(currentFontSize, 10); var newFontSize = currentFontSizeNum * 0.8; $('body').animate({fontSize: newFontSize},600); return false; }); }
Internet Explorer shows enormous variations during the resizing. Any ideas?