Logesh Logesh - 5 months ago 38
Javascript Question

How to change size of google recaptcha using javascript

Hi I inserted the Google Recaptcha into my page, I need to change the size as little bit bigger.
I got the answer in css transform method its work but not support Firefox browser, It support chrome browser only.

.recaptScale {
transform:scale(0.5);
-webkit-transform:scale(0.5);
transform-origin:0 0;
-webkit-transform-origin:0 0;
}


I need a css code for change the size of recaptcha and that support all browsers please guide me.

Answer

You can use CSS transform:scale() to changing size of google recaptcha element.

Normal size:

<script src='https://www.google.com/recaptcha/api.js'></script>
<div class="g-recaptcha" data-sitekey="a"></div>

Small size:

.recaptScale {
    transform:scale(0.5);
    -webkit-transform:scale(0.5);
    transform-origin:0 0;
    -webkit-transform-origin:0 0;
}
<script src='https://www.google.com/recaptcha/api.js'></script>
<div class="g-recaptcha recaptScale" data-sitekey="a"></div>

Large size:

.recaptScale {
    transform:scale(2);
    -webkit-transform:scale(2);
    transform-origin:0 0;
    -webkit-transform-origin:0 0;
}
<script src='https://www.google.com/recaptcha/api.js'></script>
<div class="g-recaptcha recaptScale" data-sitekey="a"></div>

Comments