Well all browsers can do the same, except for Firefox. Wired, indeed! However this zoom script works in IE, Firefox,Chrome,Safari.
jQuery(document).ready(function() { var currFFZoom = 1; var currIEZoom = 100; jQuery(".make_greater").click(function(){ var step; //only firefox sux in this case if (jQuery.browser.mozilla){ step = 0.05; currFFZoom += step; jQuery('.maincontent').css('MozTransform','scale(' + currFFZoom + ','+ currFFZoom + ')'); jQuery('.maincontent').css('transform-origin','0 0'); } else { step = 5; currIEZoom += step; jQuery('body').css('zoom', ' ' + currIEZoom + '%'); } }); jQuery(".make_smaller").click(function(){ var step; //only firefox sux in this case if (jQuery.browser.mozilla){ step = 0.05; currFFZoom -= step; jQuery('.maincontent').css('MozTransform','scale(' + currFFZoom + ','+ currFFZoom +')'); jQuery('.maincontent').css('transform-origin','0 0'); } else { step = 5; currIEZoom -= step; jQuery('body').css('zoom', ' ' + currIEZoom + '%'); } }); });
Thanks, it is very helpful and this also works nice in iPad and Tab. Thanks Man.
Hey Mario, thanks, but cold you show how can I use this on my HTML doc? Thanks.
You could send me a e-mail if you can, or anyone?
Thanks, for this code Its very helpful
i applied this code working fine in all browsers but i got issue in chrome.
issue: text appending with each other text but working fine in all other browsers. how do i overcome this issue in chrome.
Nice but it doesn’t seem to affect all styles on the ipad yet does on a desktop browser. Can’t seem to find a pattern as to why.
Seems it doesn’t like font-weight style being applied on the ipad. Bit annoying.
Or a font-size other than 1(em, rem) or 100%.
Great solution! That helped me so much. I just needed to add ‘transition’: ‘transform 0.5s’ to make it perfect. Thanks!