Javascript 如何将Recaptcha V2挑战弹出窗口定位在视口中心？

我的Recaptcha挑战弹出窗口在移动设备上溢出了视口，我也无法滚动页面。 我需要始终在视口的中心显示挑战弹出窗口（水平和垂直）。我已经看过了ReCAPTCHAAPI，但并没有发现在呈现质询弹出窗口后如何执行代码。它不是自动地以显式方式呈现的

我试过了：

• 通过在.render函数之后添加代码来更改iframe CSS类的第一个父类，但iframe为null
• 我尝试在递归函数（非阻塞循环）中检测iframe内部的Recaptcha复选框，然后更改弹出CSS类，但该复选框始终为空，直到我使用chrome检查器选中该复选框，然后尝试在控制台中获取该复选框

---

ReCaptcha v2会在较小（移动）屏幕上引发问题。我设法用CSS解决了这个问题

首先，缩小recaptcha容器（在某些示例中为g-recaptcha）以占用更少的屏幕空间（可选）

隐藏从复选框指向挑战气泡的气泡箭头（也是可选的，但看起来更好）

我相信您正在寻找类似以下内容的内容，以找到气泡箭头的兄弟div元素，该元素包含带有质询的iFrame，并将其置于屏幕中央（无论大小）

---

请注意，我正在使用CSS转换，因此请检查您的目标浏览器和版本的浏览器支持。还请注意，这适用于当前的ReCaptcha实现，如果HTML输出将来发生变化，则可能需要另一种解决方案。

Hi。你能为同样的问题编写一段代码吗？再多的解释也无助于解决css问题。

#recaptcha-container
{
    transform: scale(0.77); 
    -webkit-transform: scale(0.77); 
    transform-origin: 0 0; 
    -webkit-transform-origin: 0 0;
}

.g-recaptcha-bubble-arrow
{
    display: none;
}

.g-recaptcha-bubble-arrow + div
{
    position: fixed !important;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}