How to zoom webpage body using jquery in mozilla firefox

Question

I have webpage and i want to zoom its body whenever it load using jquery but css zoom feature not working for mozilla firefox. Currently Using

$("body").css("zoom", "1.05");

It worked in chrome , opera ,edge but not working in firefox

Since zoom css doesn't working in mozilla, i try this

$("body").css("MozTransform","scale("+1.05+")");

But it didn't work . It will be great help if you give me solution .

Answer 1

You can try this

<script type="text/javascript">
        function zoomin() {
            document.body.style.zoom = "50%" 
        }
</script>

<body onload="zoomin()">
<h1>Whatever</h1>
</body>

Answer 2

Here is another answer for all modern browsers

$('body').css({
  'transform'                : 'scale(1.05)',
  'transform-origin'         : '0 0',
  '-moz-transform-origin'    : '0 0',         /*Firefox*/
  '-ms-transform-origin'     : '0 0',         /*IE*/
  '-webkit-transform-origin' : '0 0',         /*Opera/Safari*/
  '-moz-transform'           : 'scale(1.05)', /*Firefox*/
  '-ms-transform'            : 'scale(1.05)', /*IE*/
  '-webkit-transform'        : 'scale(1.05)'  /*Opera/Safari*/
});

Note : You can also define CSS zoom property like as above code.

How to zoom webpage body using jquery in mozilla firefox

Question

2 answers

solution1
0

solution2
0 2017-03-26 12:30:31

How to zoom webpage body using jquery in mozilla firefox

Question

2 answers

solution1 0

solution2 0 2017-03-26 12:30:31

solution1
0

solution2
0 2017-03-26 12:30:31